<select v-model='type' @change='changeType' class='form-control'>
     <option value='radio'>单选</option><option value='checkbox'>多选</option>
</select>

vue获取当前select选中的value和text,vue的methods:

changeType: function (ele) {
	var optionTxt = $(ele.target).find("option:selected").text();
	var optionVal = ele.target.value;
}
切换组件类型,针对像:radio,checkbox,都是一样的数据格式,只是input的type不一样,

在绑定的时候,将type也动态赋值就好了:

<input :type='type' :checked='option.checked' >
每一个控件是一个对象,每个控件对象的type不一致,

切换后 获取到对应的类型 上面代码,再改变绑定的model.type的值,就实现切换了。

还有下拉框绑定默认值: 上面写的v-model='type'  type的值是要和option对应的value一直,选择后他才能默认选中。

Logo

前往低代码交流专区

更多推荐