首页 > 其他分享 >el-radio-group初始化默认值后点击无法切换问题/vue中设置表单对象属性页面不同步问题

el-radio-group初始化默认值后点击无法切换问题/vue中设置表单对象属性页面不同步问题

时间:2022-12-26 15:36:47浏览次数:40  
标签:初始化 vue group 对象 表单 点击 默认值 属性

 

复制代码
<el-radio-group v-model="ruleForm.type">
    <el-radio :label="1">方案一</el-radio>
    <el-radio :label="2">方案二</el-radio>
  </el-radio-group>

原初始化方式:点击无法切换:
this.ruleForm.type = 1;

解决方式:
var obj = {type : 1};
this.ruleForm = obj;
增加中间变量,设置相关属性后,赋值给表单对象。

说明:v-model,因为监听机制的原因,没有监听到表单对象中的属性的变化,所以需要对表单对象本身重新做一次赋值变化处理。
复制代码

 

   

标签:初始化,vue,group,对象,表单,点击,默认值,属性
From: https://www.cnblogs.com/yelanggu/p/17005892.html

相关文章

  • el-radio-group之迷惑操作:label和label
    el-radio-group之迷惑操作:label和label今天学习element-ui的el-radio-group的时候发现el-radio-group的默认值设置无效,但是点击其他单选框可以切换成功。element-ui官......
  • 快速创建Vue项目
    step1:初始化项目vueinitwebpackteststep2:安装[email protected]注意:需要进入项目目录;安装router的版本......
  • [Vue Router warn]: No match found for location with path
    vue-router.mjs:35[VueRouterwarn]:Nomatchfoundforlocationwithpath""[VueRouterwarn]:uncaughterrorduringroutenavigation:原来用route.push报......
  • vue的三种渲染定义方式
    title:vue的三种渲染定义方式description:'vue的三种渲染定义方式:template,render,app.mount()'tags:-vuedate:2022-11-2020:10目录vue的三种渲染定义方......
  • Vue 禁止滚动
    比如我们想做一个校验,会出现一个弹窗,填写校验信息,此时页面禁止滚动可以绑定如下事件change(){//show控制弹窗显隐this.show=!this.showif(this.show......
  • vue封装通用组件
    使用Vue.component可以用来注册全局组件//main.js...importSchoolfrom"./components/School.vue"Vue.component("test123",School)...//.vue<template>......
  • Vue路由
    VueRouter一、对前端路由的理解路由:路由是url到函数的映射,可以根据不同的url地址展示不同的内容或页面。服务器端路由(后端路由)对于服务器来说,当接收到客户端发......
  • Vue3快速上手,Vue3全解
    1.Vue3简介2020年9月18日,Vue.js发布3.0版本,代号:OnePiece(海贼王)耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者github上的tags地址:https://github.com/vuejs/vue......
  • 基于 Ant Design Vue实现tree的增删改
    背景:在维护的项目是基于AntDesignVue框架实现的,需求是新建时,前端需要将树形结构维护完成后,一次性调用接口进行下发,在网上找了半天资料,要不源码不全,要不就是增删改后实......
  • vue中$attrs
    $attrs用来保存给子组件绑定了,但子组件没有接收的数据,如下://父组件...<Schoolv-bind="{a,b,c}"></School>...//子组件School...props:['a','b']...打印子......