uni-app Vue 笔记总结 (自用)

1、json通过key获取value：

rateNum = eval(e.value)
(key == "value")

2、vue获取input输入框的数据

<textarea maxlength="300" :disabled="false" @input="descInput" placeholder="请输入相关内容..." 
v-model="desc" ref="descInput" 
style="height: 400upx"></textarea>
<text>{{remnant}}/300</text>

(1)设置ref

(2)获取数据

var inputStr = this.$refs.descInput.value

3、限制input字数

textarea maxlength="300" 

4、实施显示可输入字符数

(1)监听

@input="descInput"
v-model="desc" 
ref="descInput" 

(2)右下角字符限制300

var txtVal = this.desc.length
this.remnant = 300 - txtVal

5、uni-app @tap绑定无效，无法触发tap点击事件

          原因：检查@tap是否添加在控件上

6、添加原生导航栏自定义按钮

在项目工程pages.json下，添加：

"style": {
	"navigationBarTitleText": "添加评论",
	"titleNView": {
		"buttons": [ //原生标题栏按钮配置,
			{
			    "type":"none",
				"text":"发送",
				"float":"right",
				"fontSize":"14"
			}
		 ]		
	    }
}

7、原生导航栏自定义按钮监听

onNavigationBarButtonTap() {
	console.log("点击了自定义按钮"); 
}

8、this用法

        在Vue中

var vm = new Vue({
            el: "#root",
            data:data,
            methods: {
                changeColor() {
                    vm.isClick = true;
                }
            }
        });

        在uni-app中，this 就是Vue中的 vm

9、refs获取组件或元素

获取数据
var test = this.$refs.(ref属性名).(需要获取的属性或者方法名)
修改数据
this.$refs.(ref属性名).(需要获取的属性或者方法名) = xxxx