@wxa/watch v2.5.1

@wxa/watch

详细的文档

More Detail Documentation

watch插件基于melanke-watchjs实现，本插件只是简单包装，以适配小程序环境。

安装

# 使用npm安装
npm i -S @wxa/watch

用例

1. 在app.js/app.wxa中引入后注册。

// app.js or app.wxa
import {App, wxa} from '@wxa/core';
import watchPlugin from '@wxa/watch';

wxa.use(watchPlugin);

@App
export default class Main {};

2. 在页面类中定义watch对象，指定需要监听的数据。

import {Page} from '@wxa/core';

@Page
export default class Index {
    data = {
        formData: {
            name: '',
            email: ''
        }
    }
    watch = {
        formData(newValue) {
            // 判断表单数据是否为空
            let isValid = !!Object.keys(newValue).find((key)=>!newValue[key]);
            this.setData({isValid})
        }
    }
}

使用watch，我们可以替代一部分.wxs的能力，实现类似computed的特性。

::: warning 注意 数据监听只对提前定义在data中的数据有效，后续动态添加的数据都无法监听，比如例子中的isValid。

可以监听数组本身，但不能监听数组新增的项。 :::