hookehuyr

测试新增单选其他提交新内容功能

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: 2023-01-18 16:14:00 4 + * @LastEditTime: 2023-01-30 11:09:03
5 * @FilePath: /data-table/src/components/RadioField/index.vue 5 * @FilePath: /data-table/src/components/RadioField/index.vue
6 * @Description: 单项选择控件 6 * @Description: 单项选择控件
7 --> 7 -->
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
29 style="margin-bottom: 0.25rem" 29 style="margin-bottom: 0.25rem"
30 >{{ x.title }}</van-radio 30 >{{ x.title }}</van-radio
31 > 31 >
32 - <van-field v-model="value" label="" placeholder="请输入用户名" /> 32 + <van-field v-if="has_add_info" :name="item.key + '#other_add_info'" v-model="add_info" label="" placeholder="请输入补充信息" />
33 </van-radio-group> 33 </van-radio-group>
34 </template> 34 </template>
35 </van-field> 35 </van-field>
...@@ -53,13 +53,14 @@ const HideShow = computed(() => { ...@@ -53,13 +53,14 @@ const HideShow = computed(() => {
53 }) 53 })
54 // TEST: 测试新功能:选择其他选项时,下方出现输入框,如果其他项被选中,输入框值为最终录入值。 54 // TEST: 测试新功能:选择其他选项时,下方出现输入框,如果其他项被选中,输入框值为最终录入值。
55 // 绑定值发生变化时回调,处理选项为其他时的输入项录入 55 // 绑定值发生变化时回调,处理选项为其他时的输入项录入
56 -const value = ref(''); 56 +const has_add_info = ref(false); // 文字不一定是其他,后续可能需要字段绑定一个值,标识是否有其他输入框进行判断
57 +const add_info = ref('');
57 const onChange = (item) => { 58 const onChange = (item) => {
58 console.warn(item); 59 console.warn(item);
59 } 60 }
60 -// onMounted(() => { 61 +onMounted(() => {
61 -// props.item.value = '120' 62 + // props.item.value = '120'
62 -// }) 63 +})
63 </script> 64 </script>
64 65
65 <style lang="less" scoped> 66 <style lang="less" scoped>
......
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: 2023-01-18 16:12:51 4 + * @LastEditTime: 2023-01-30 11:07:51
5 * @FilePath: /data-table/src/views/index.vue 5 * @FilePath: /data-table/src/views/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -358,11 +358,25 @@ const validOther = () => { ...@@ -358,11 +358,25 @@ const validOther = () => {
358 return valid; 358 return valid;
359 }; 359 };
360 360
361 -const onSubmit = async (values) => { 361 +// 预处理表单数据
362 +const preValidData = (values) => {
362 // 过滤掉标识为 ignore,undefined 的字段数据 363 // 过滤掉标识为 ignore,undefined 的字段数据
363 let { ignore, undefined, ...rest_data } = values; 364 let { ignore, undefined, ...rest_data } = values;
365 + // TAG: 处理其他补充消息
366 + for (const key in rest_data) {
367 + if (key.includes('other_add_info')) {
368 + const name = key.split('#')[0];
369 + rest_data[name] = rest_data[key]
370 + }
371 + }
372 + // console.warn(postData.value);
364 // 合并自定义字段到提交表单字段 373 // 合并自定义字段到提交表单字段
365 - postData.value = _.assign(postData.value, rest_data); 374 + return _.assign(postData.value, rest_data);
375 +}
376 +
377 +const onSubmit = async (values) => {
378 + // 表单数据处理
379 + postData.value = preValidData(values)
366 // 检查非表单输入项 380 // 检查非表单输入项
367 if (validOther().status) { 381 if (validOther().status) {
368 // 编辑模式不能提交数据 382 // 编辑模式不能提交数据
......