Skip to main content

单页应用变量赋值

在单页应用(如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)