数据绑定

更新时间:

蓝河应用提供了数据绑定 UI 组件的方式,当数据发生变化时,会自动触发 UI 组件的更新。

绑定方法

用法上,开发者可以在组件上使用 "{{varname}}" ,即双大括号内放置变量的形式,即可将变量绑定在 UI 组件上。

示例如下

<template>
  <div>
    <text>{{title}}</text>
    <input type="button" value="changeTitle" onclick="changeTitle" />
  </div>
</template>

<script>
  export default {
    data: {
      title: 'Hello World!',
    },
    changeTitle() {
      this.title = 'Hello 蓝河应用'
    },
  }
</script>
复制代码

注意事项

响应式数据必须先在 data 上静态声明或者使用 this.$set 动态添加,不能直接使用 this.title = 'hello' 添加。

错误示例

<script>
  export default {
    data: {},
    onInit() {
      this.title = 'Hello 蓝河应用'
    },
  }
</script>
复制代码
上一篇
页面路由
下一篇
列表渲染
以上内容对您是否有帮助?
  • 毫无帮助
  • 帮助不大
  • 一般
  • 很好
  • 非常好
意见反馈