uniapp遇到的问题

1.uniapp u-popup弹窗内嵌from表单组件时报错，规则找不到

        
        
            
                
                 
                
            
            
                提交
                取消
            
        
        
    

规则：

show :false,
form :{},
rules:{
            name: [
                { 
                    required: true, 
                    message: '请输入姓名',  
                    trigger: ['change'],
                }
            ],
        },

如上面的代码所示，弹窗内嵌套了一个表单组件，这个时候如果根据官方文档去写 在 onReady 加载表单规则，就会报错提示 找不到表单组件，加载不了。

也就是  Cannot read properties of undefined (reading 'setRules')  

打印 this.$refs.uForm 会出现 undefined，如下图所示

这个时候只需要写一个watch 监听 u-popup 加载速度即可 

watch:{
        // this.$refs.uForm.setRules(this.rules);
        show:{
            handler(value){
                this.$nextTick(()=>{ //在弹窗加载出来只有 show 才会变成 true
                    if( value == true ){ //判断 弹窗 v-model 变成 true 的时候去加载规则。 原理：在弹窗渲染完成之后表单渲染完成之前去加载规则就不会报错了
                        this.$refs.uForm.setRules(this.rules);
                    }
                })
            },
        },
        immediate: true, // 重点
        deep: true, // 重点
    },

2、在使用uniapp中需要修改data中的值，但是页面没有发生变化

原因：数据层次太多，没有触发render函数进行自动更新

解决方法：需手动调用，调用方式如下
this.$forceUpdate();

//需要修改的值
data() {
	return {
		data:{},
	};
},

//改代码如下：
this.data.a2 = "hello";
this.$forceUpdate();