hookehuyr

fix 多行文本组件,只读模式下默认值替换换行符

1 <!-- 1 <!--
2 * @Date: 2022-08-29 14:31:20 2 * @Date: 2022-08-29 14:31:20
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-08-12 17:37:58 4 + * @LastEditTime: 2024-09-14 13:40:21
5 * @FilePath: /data-table/src/components/TextareaField/index.vue 5 * @FilePath: /data-table/src/components/TextareaField/index.vue
6 * @Description: 多行文本输入框 6 * @Description: 多行文本输入框
7 --> 7 -->
...@@ -17,9 +17,7 @@ ...@@ -17,9 +17,7 @@
17 v-html="item.component_props.note" 17 v-html="item.component_props.note"
18 style="font-size: 0.9rem; margin-left: 1rem; color: gray; padding-bottom: 0.5rem; padding-top: 0.25rem; white-space: pre-wrap;" 18 style="font-size: 0.9rem; margin-left: 1rem; color: gray; padding-bottom: 0.5rem; padding-top: 0.25rem; white-space: pre-wrap;"
19 /> 19 />
20 - <div v-if="item.component_props.readonly" style="padding: 0.5rem 1rem; font-size: 0.9rem;"> 20 + <div v-if="item.component_props.readonly" style="padding: 0.5rem 1rem; font-size: 0.9rem; text-align: justify;" v-html="item.value"></div>
21 - {{ item.value }}
22 - </div>
23 <van-field 21 <van-field
24 v-else 22 v-else
25 v-model="item.value" 23 v-model="item.value"
...@@ -57,7 +55,8 @@ const ReadonlyShow = computed(() => { ...@@ -57,7 +55,8 @@ const ReadonlyShow = computed(() => {
57 }); 55 });
58 56
59 onMounted(() => { 57 onMounted(() => {
60 - props.item.value = props.item.component_props.default; 58 + // 只读模式下默认值替换换行符
59 + props.item.value = item.component_props.readonly ? props.item.component_props.default?.replace(/\n/g, "<br>") : props.item.component_props.default;
61 }) 60 })
62 </script> 61 </script>
63 62
......