使用方式
一: 单选列表组合 type="default"(如指派改善任务)
<tm-radio-group
:list="list"
label="改善工具"
:defaultValue='defaultValue'
@change="changeSelect"
:setting="{
value: 'value',
name: 'label'
}"
/>
export default {
data() {
return {
// 默认选中
defaultValue: 1,
// 渲染的原数据
list: [
{value: 1, label: 'PDCA1'},
{value: 2, label: 'PDCA2'},
{value: 3, label: 'PDCA3'},
{value: 4, label: 'PDCA4'}
]
}
},
methods: {
/***
* 选中状态改变触发
* @param {Number | String} selectData 当前选中的值
* @param {Object} selectData 当前选中的整条数据
* @param {Number} index 当前选中下标
*/
changeSelect(selectVal, selectData, index) {
this.defaultValue = selectVal;
}
}
}
二: 下拉式单选列表组合 type="select"(如人员架构)
<tm-radio-group
type="select"
:list="list"
:defaultValue='defaultValue'
@change="changeSelect"
:openkeys="[0]"
:setting="{
pName: 'pName',
child: 'childList',
value: 'value',
name: 'label'
}"
/>
export default {
data() {
return {
// 默认选中
defaultValue: 1,
// 渲染的原数据
list: [
{
pValue: 1,
pName: '门诊',
childList: [
{value: 1, label: 'PDCA1'},
{value: 2, label: 'PDCA2'},
{value: 3, label: 'PDCA3'},
{value: 4, label: 'PDCA4'}
]
},
{
pValue: 2,
pName: '分诊',
childList: [
{value: 11, label: '许玮琛1'},
{value: 22, label: '许玮琛2'},
{value: 33, label: '许玮琛3'},
{value: 44, label: '许玮琛4'}
]
}
]
}
},
methods: {
/***
* 选中状态改变触发
* @param {Number | String} selectData 当前选中的值
* @param {Object} selectData 当前选中的整条数据
* @param {Number} index 当前选中下标
*/
changeSelect(selectVal, selectData, index) {
this.defaultValue = selectVal;
}
}
}