一个用于创建JSON接口的网站 http://myjson.com/api

http://myjson.com/api 你可以用来创建你用于测试临时JSON数据
这里写图片描述
创建完他会生成一个JSON的接口用于访问
这里写图片描述
使用Vue和fetch进行测试

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app-8">
    <ul>
        <li v-for="product in products">
            {{product.hitokoto}}
        </li>
    </ul>
</div>
<script>
    const app8=new Vue({
        el:"#app-8",
        data:{
            products:[]
        },
        created(){
            fetch("https://api.myjson.com/bins/1etybi")
                .then( response => response.json() )
                .then(json=>{
                    this.products=json.ps
                })
        }
    })

效果图
这里写图片描述

猜你喜欢

转载自blog.csdn.net/qq_33981438/article/details/80537826