Uniapp一言“一句话接口调用

  • 界面

  • 代码
  • 
    
    
    
    export default {
        data(){
            return{
                data:"",
       canAdd: true,
            }
        },
        methods:{
            getData(){
                uni.request({
                    url:"https://api.uixsj.cn/hitokoto/get",
                    data:{
                        code:"json"
                    },
                    success: (res) => {
                        console.log(res.data);
                        // 将请求到的数据存放放到dataList中
                        this.data = res.data.content;
                    }
                });
            },
       add() {
            this.getData();
          },
          
        },
      mounted() {
         this.getData();
       }
    }
    
    
    
    
  •  总结

        代码基于Vue.js框架,向一言接口发送请求获取数据并渲染到页面中。具体实现过程如下:

  1. 页面渲染时,首先调用mounted函数,然后getData函数会被执行。
  2. getData函数使用uni.request向指定的URL发送请求,通过传递一个code参数告诉服务器返回JSON格式的数据。
  3. 如果请求成功,则服务器返回的数据会存储在res.data中,然后通过将res.data.content赋值给组件的data属性,来更新data变量的值。
  4. 将data的值渲染到页面中的文本框中。
  5. 点击"换一句"按钮,add方法会被调用,再次调用getData方法来获取新的句子并更新data的值。

        在getData函数中,this.data的值将被更新为从服务器获取的最新数据的content属性,然后将其渲染到页面上。

你可能感兴趣的:(uni-app)