uniapp 封装弹窗组件(popup ,单选按钮,可以自选表单并提交表单)附有完整代码

uniapp 封装弹窗组件(popup ,单选按钮,可以自选表单并提交表单)附有完整代码_第1张图片

 ↓界面结构如下

首先利用radio-group 中的label分成两部分,这样点单选按钮就可以出发整个label包裹的样式↓(点击label区域单选按钮亮起,触发radioChange方法改变radioState的状态)

uniapp 封装弹窗组件(popup ,单选按钮,可以自选表单并提交表单)附有完整代码_第2张图片

uniapp 封装弹窗组件(popup ,单选按钮,可以自选表单并提交表单)附有完整代码_第3张图片

 选中的效果可以参照↓

:class="[radioState==true?'popConfig-content-item-check':'popConfig-content-item-uncheck','popConfig-content-item']">

完整代码如下↓






如何使用该组件↓

		
		
		

你可能感兴趣的:(uniapp,uni-app,前端,vue.js)