uni-app中使用nvue发起网络请求时，无法实现双向绑定

分类：nvue

uni_app

代码如下

<template>  
    <div>  
        {{user.userName}}  
    </div>  
</template>  

<script>  
    export default {  
        created() {  
            uni.request({  
                url: 'http://127.0.0.1/getUserInfo', //仅为示例，并非真实接口地址。  
                data: {  
                    userName: 'xxx'  
                },  
                method: 'POST',  
                success: (res) => {  
                    this.user = res.data;  
                    console.log(JSON.stringify(this.user));//这里是有数据的，但是上面的div里的user还是空的。  
                }  
            });  
        },  
        data() {  
            return {  
                user:{}  
            };  
        }  
    };  
</script>

2019-05-20 18:31 负责人:无分享

6 个回复

clouds

data(){
return {
user :{
userName:''
}
}
}

老丘 (作者)

不行哦，我的user对象里就有userName这个属性，但是在created的时候赋值不了。你这种写法我也试过了，好无力。。

2019-05-21 08:03

6***@qq.com - 小明

你确定箭头表达式中的this指向的仍是vue对象吗？

老丘 (作者)

嗯，我在vue这样写是可以的，在nvue这样写就不行

2019-05-21 08:47

DCloud_UNI_CHB

模板中加个text嵌套，如下：

<template>    
    <div>  
        <text>    
        {{user.userName}}    
        </text>  
    </div>    
</template>

老丘 (作者)

试了，还是不行。

如果是静态数据赋值过去就能显示，如果是动态异步获取后端的数据就显示不了

2019-05-21 14:50
DCloud_UNI_FXY

回复老丘: 你的问题有两个

1.文本节点需要套在 text 标签里

2.data 里边声明 user 的时候，要带上 userName,即 user:{userName:''}，否则需要手动调用this.$forceUpdate()强制触发渲染

2019-05-25 12:41