hookehuyr

fix 表格组件默认值渲染时机优化

<!--
* @Date: 2024-07-12 13:28:27
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-08-01 15:48:02
* @LastEditTime: 2024-08-01 17:00:57
* @FilePath: /data-table/src/components/TEditor/index.vue
* @Description: 文件描述
-->
......@@ -96,6 +96,10 @@ const props = defineProps({
type: Number,
default: 630,
},
table_html: {
type: String,
default: ''
}
});
const loading = ref(false);
const tinymceId = ref(
......@@ -225,13 +229,15 @@ const tinymceOptions = {
// };
// input.click();
// },
// init_instance_callback: function (editor) {
init_instance_callback: function (editor) {
// editor.on('click', function (e) {
// // tinymce 使用 <iframe> 实现功能,当点击 tinymce 的输入框时应该让表单设计器选中对应的字段,
// // 所以需要把点击事件转发给 iframe 外面的 textarea
// document.getElementById(editor.id).click();
// });
// },
// 初始化实例
tinymce.activeEditor.setContent(props.table_html);
},
}
// 外部传递进来的数据变化
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-08-01 16:24:00
* @LastEditTime: 2024-08-01 16:50:57
* @FilePath: /data-table/src/components/TableField/index.vue
* @Description: 文件描述
-->
......@@ -12,7 +12,7 @@
<span :class="[ReadonlyShow ? 'readonly-show' : '']">{{ item.component_props.label }}</span>
</div>
<div class="tinymce-box">
<TEditor ref="refEdit" @blur="onBlur" :readonly="item.component_props.readonly"></TEditor>
<TEditor ref="refEdit" @blur="onBlur" :table_html="table_html" :readonly="item.component_props.readonly"></TEditor>
</div>
<!-- <div @click="getValue">获取内容</div>
<div @click="setValue">设置内容</div> -->
......@@ -57,7 +57,7 @@ const ReadonlyShow = computed(() => {
onMounted(() => {
$('.tinymce-box').width($('.table-field-page').width() + 'px');
//
// table_html.value = props.item.component_props.default;
table_html.value = props.item.component_props.default;
//
props.item.value = {
key: "table",
......@@ -65,9 +65,13 @@ onMounted(() => {
value: props.item.component_props.default,
};
emit("active", props.item.value);
setTimeout(() => {
refEdit.value.handleSetContent(props.item.component_props.default)
}, 1000);
// setTimeout(() => {
// }, 1000);
// nextTick(() => {
// if (refEdit.value) {
// refEdit.value.handleSetContent(props.item.component_props.default)
// }
// })
});
const refEdit = ref(null);
......