uniapp组件JS变量与组件的事件

admin

在组件中使用js变量：
语法糖：双冒号：等同于v-bind:动态更新HTML元素上的属性，比如id,clas,href等
组件属性名 如果带有：，后面的属性值要被双冒号""包裹，包裹的值不是字符转而是一个变量；在script中的data（数据）中会有各种处理

1. <button size="mini" :disabled="buttondisble" hover-start-time=20 >{{buttonText}}</button>
   
2. data() {
   
3.     return {
   
4.         "buttonText":"按钮",
   
5.         "buttondisble":false
   
6.     }
   
7. }

复制代码

组件的事件：
语法糖：@等同于v-on，绑定事件监听
组件属性名 如果带有@，后面的属性值要被双冒号""包裹，包裹的值不是字符串，指向一个在script的methods里定义过的js方法，还可以给方法传参数。

1. <button size="mini" @click="goto('/pages/about/about')">按钮</button>
   
2. methods: {
   
3.     goto(url) {
   
4.         console.log("按钮被点击了，且传入的参数是：" + url)
   
5.     }
   
6. }

复制代码