vue2链式调用写法

Vue.js 2.x版本的链式调用是一种创建、修改和操作组件实例属性的方式，它允许开发者以一种直观的方式来组织DOM相关的数据绑定和事件处理。链式调用通常涉及以下几个关键点：

1. **实例化**：通过Vue构造函数创建一个新的实例并挂载到元素上，如`new Vue({ el: '#app' })`。

2. **数据绑定**：在`.data()`选项中定义初始的数据对象，然后在实例上调用这些数据，如`this.message = 'Hello'`。

3. **方法调用**：Vue的实例也提供了一系列响应式的`methods`，可以在链式调用中进行其他操作，比如`this.someMethod().then(() => {})`。

4. **属性设置**：使用点(`.`)或方括号(`[]`)语法设置动态属性，例如`this.$set(this, 'someProperty', value)`用于响应式地添加新属性。

5. **事件监听**：使用`.on()`或`.addEventListener()`来注册事件处理器，然后在`v-on`指令中触发它们。

链式调用示例：

new Vue({
  data: {
    message: 'Hello'
  },
  methods: {
    setMessage() {
      this.message = 'Hola';
    }
  },
  mounted() {
    this.setMessage();
    this.$el.querySelector('.my-element').addEventListener('click', this.someCallback);
  }
}).$mount('#app');