vue-利用属性（v-if）控制表单（el-form-item）显示/隐藏

作者：小蓝xlanll | 2024-02-23 05:12:33

踩

表单控制属性 `v-if`

示例：

通过switch组件作为开关，控制表单的显示与隐藏

 <el-form-item label="创建数据集">
   <el-switch v-model="selectFormVisible"></el-switch>
 </el-form-item>
 <el-form-item label="新数据集名称" v-if="selectFormVisible==true">
   <el-input v-model="form.new_name" placeholder="default_name" :visible.sync="selectFormVisible"></el-input>
 </el-form-item>
1
2
3
4
5
6

绑定显隐性变量

export default {
  name: "Class",
	data () {
		return {
		selectFormVisible : false
		}
}
1
2
3
4
5
6
7

实现效果：
在这里插入图片描述

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小蓝xlanll/article/detail/133919

vue-利用属性（v-if）控制表单（el-form-item）显示/隐藏

表单控制属性 v-if

示例：

表单控制属性 `v-if`