我正在尝试在 Vue 组件中的 props 上对观察者进行单元测试。我正在使用业力+茉莉花。但似乎在单元测试中不会触发道具上的观察者。
这是一个简单的组件：
export default {
name: 'hello',
data: function () {
return {
b: null
};
},
props: {
a: {
type: String,
default: null
}
},
watch: {
a(val) {
this.b = val;
}
},
computed: {
c() {
return this.a + " computed";
}
}
}
这是我的测试：
describe('Hello', () => {
const HelloCtor = Vue.extend(Hello);
let vm;
beforeEach(() => {
vm = new HelloCtor({
propsData: {
a: "hello"
}
}).$mount();
});
afterEach(() => {
vm.$destroy();
});
it('should watch a and compute c', (done) => {
vm.$nextTick(() => {
expect(vm.c).toBe("hello computed");
expect(vm.b).toBe("hello");
done();
});
});
});
在断言中，"c"计算正确，但"b"始终为空。如果我将"a"移动到数据，一切正常。 请注意，当我在浏览器中手动测试我的应用程序时，就像数据变量上的观察者一样，会触发 props 上的观察者。
关于如何测试它的任何想法？
b总是空的，仅仅是因为在你开始观察它的变化后a没有被修改。
当您开始监视变量时，不会触发观察程序，它仅在其值更改时触发。