vue2 自定义 el-radio-button 的样式并设置默认值的方法_vue.js_

指定认领自荐

::v-deep .el-radio-button__inner { width: 100px; height: 36px; border: 0 !important; font-size: 14px; font-weight: 400; color: #696969; line-height: 14px; outline: none; box-shadow: none; } // 修改激活后的样式 ::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner { background: #f2f2f2; border: 0 !important; color: #696969; line-height: 14px; outline: none; box-shadow: none; }

data () { return { taskForm: { taskTypeRadio: 0 }, } }

男女

::v-deep.el-radio-button{ margin-right: 15px; border-radius:4px; .el-radio-button__inner {//修改按钮样式 width: 120px; height: 42px; background: #F7F8FA; color:#333; border: 0 !important; } .el-radio-button__orig-radio:checked + .el-radio-button__inner {// 修改按钮激活样式 color: #fff; background-color: #f63; border-color: #f63; box-shadow: -1px 0 0 0 #f63; } }