hookehuyr

✨ feat: 单选控件新增排列方向属性控制

1 <!-- 1 <!--
2 * @Date: 2022-08-30 11:34:19 2 * @Date: 2022-08-30 11:34:19
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-08-30 13:54:06 4 + * @LastEditTime: 2022-09-08 11:37:01
5 * @FilePath: /data-table/src/components/RadioField/index.vue 5 * @FilePath: /data-table/src/components/RadioField/index.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
10 <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div> 10 <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div>
11 <van-field :name="item.key"> 11 <van-field :name="item.key">
12 <template #input> 12 <template #input>
13 - <van-radio-group v-model="item.value"> 13 + <van-radio-group v-model="item.value" :direction="item.component_props.direction">
14 <van-radio v-for="x in item.options" :key="index" :name="x.key" icon-size="1rem" 14 <van-radio v-for="x in item.options" :key="index" :name="x.key" icon-size="1rem"
15 style="margin-bottom: 0.25rem;">{{ x.value }}</van-radio> 15 style="margin-bottom: 0.25rem;">{{ x.value }}</van-radio>
16 </van-radio-group> 16 </van-radio-group>
......
1 <!-- 1 <!--
2 * @Date: 2022-07-18 10:22:22 2 * @Date: 2022-07-18 10:22:22
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-08 10:17:43 4 + * @LastEditTime: 2022-09-08 11:35:17
5 * @FilePath: /data-table/src/views/index.vue 5 * @FilePath: /data-table/src/views/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -79,23 +79,24 @@ onMounted(() => { ...@@ -79,23 +79,24 @@ onMounted(() => {
79 // }, 79 // },
80 // required: false, 80 // required: false,
81 // }, 81 // },
82 - // { 82 + {
83 - // key: 'gender', 83 + key: 'gender',
84 - // value: '', 84 + value: '',
85 - // label: '性别', 85 + label: '性别',
86 - // placeholder: '', 86 + placeholder: '',
87 - // component: '', 87 + component: '',
88 - // component_props: { 88 + component_props: {
89 - // name: 'radio' 89 + name: 'radio',
90 - // }, 90 + direction: 'horizontal'
91 - // options: [{ 91 + },
92 - // key: '男', 92 + options: [{
93 - // value: '男' 93 + key: '男',
94 - // }, { 94 + value: '男'
95 - // key: '女', 95 + }, {
96 - // value: '女' 96 + key: '女',
97 - // }] 97 + value: '女'
98 - // }, 98 + }]
99 + },
99 // { 100 // {
100 // key: 'hobby', 101 // key: 'hobby',
101 // value: [], 102 // value: [],
...@@ -172,18 +173,18 @@ onMounted(() => { ...@@ -172,18 +173,18 @@ onMounted(() => {
172 // columns_type: ['year', 'month'] 173 // columns_type: ['year', 'month']
173 // }, 174 // },
174 // }, 175 // },
175 - { 176 + // {
176 - key: 'time', 177 + // key: 'time',
177 - value: '', 178 + // value: '',
178 - label: '时间选择', 179 + // label: '时间选择',
179 - placeholder: '请选择时间', 180 + // placeholder: '请选择时间',
180 - component_props: { 181 + // component_props: {
181 - name: 'time_picker', 182 + // name: 'time_picker',
182 - title: '请选择', 183 + // title: '请选择',
183 - columns_type: ['hour', 'minute'] 184 + // columns_type: ['hour', 'minute']
184 - }, 185 + // },
185 - required: true, 186 + // required: true,
186 - }, 187 + // },
187 // { 188 // {
188 // key: 'image_src', 189 // key: 'image_src',
189 // value: '', 190 // value: '',
......