单页应用变量赋值
在单页应用(如vue和react)的场景中,通过操作元素的方式可能无法改变其变量
的,如日期控件元素被点击后也无法修改对应的模型变 量
,itBuilder提供一种方式可以修改上述的变量。
安装依赖
yarn @itbuilder/auto-tester-helper
或
npm install @itbuilder/auto-tester-helper
引入依赖
一般是在入口文件引入,如(main.js):
import '@itbuilder/auto-tester-helper'
Vue设置变量
tip
原理说明:
在 Vue 应用中,每个 Vue 组件实例都会附加到它所控制的 DOM 元素上,这样你可以通过访问 DOM 来获取 Vue 实例。在开发模式下,Vue 实例通常会被附加为 DOM 元素的一个属性,通常是 __vue__
。这样做可以方便开发者在控制台中访问和调试。
如我们可以通过下面代码获取到vue实例
,并调用其$set
方法为实例的模型变量startTime
赋值:
var now = new Date();
const v= document.querySelector("#pane-NORMAL > div > div.coupon > form").__vue__;
v.$set(v.model, 'startTime', now)