标签:hang name methods turn mode 下拉 打印 EDA 名称
项目中有一个问题是在一个下拉选择的表单,当改变其值时表单下边会出现新的特定的表单需要填写,所以在选择一个值的时候,进行下边的表单填写,但当此时再改变选择的值,下边的表单将变为初始值,当时是在created中把下边动态改变的表单初始的值保存下来,因为created只在渲染dom时运行一次
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="活动区域">
<el-select v-model="form.region" placeholder="请选择活动区域" @change="changeData">
<el-option label="上海" value="shanghai"></el-option>
<el-option label="北京" value="beijing"></el-option>
<el-option label="山东" value="shanghai"></el-option>
<el-option label="内蒙古" value="beijing"></el-option>
</el-select>
</el-form-item>
<!-- 下边的数据根据上边的改变展开为初始值 -->
<el-form-item label="活动名称">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="人员年龄">
<el-input v-model="form.age"></el-input>
</el-form-item>
<el-form-item label="活动地址">
<el-input v-model="form.address"></el-input>
</el-form-item>
<el-form-item label="人员联系方式">
<el-input v-model="form.phone"></el-input>
</el-form-item>
</el-form>
data() {
return {
form: {
region: "",
name: "party",
age: "",
address: "",
phone: ""
},
textData:{}
};
},
methods: {
//当改变值时将之前填写的表单数据变为原始的数据
changeData(){
this.form =JSON.parse(this.textData)
}
},
created() {
this.textData =JSON.stringify(this.form) ;
},
主要的是用 JSON.parse(JSON.stringify(this.form))保存下,若直接赋值,则一个值改变,另一个打印出来的也是改变以后的值,原理就是和堆和栈有关,所以要想变为原来的值需要保留原来的值,用这个办法
标签:hang name methods turn mode 下拉 打印 EDA 名称
原文地址:https://www.cnblogs.com/yanyanliu/p/12043726.html