fix
This commit is contained in:
@@ -22,14 +22,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { reactive, ref, nextTick, useAttrs, inject, watch } from 'vue'
|
import { reactive, ref, onMounted } from 'vue'
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
data: {
|
data: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => ({})
|
default: () => ({})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const emit = defineEmits(['delete-node', 'copy-node'])
|
const emit = defineEmits(['update-data'])
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
text: props.data?.text || '双击编辑文本'
|
text: props.data?.text || '双击编辑文本'
|
||||||
})
|
})
|
||||||
@@ -39,6 +39,7 @@
|
|||||||
const onInput = () => {
|
const onInput = () => {
|
||||||
const text = inputRef.value.innerText
|
const text = inputRef.value.innerText
|
||||||
data.text = text
|
data.text = text
|
||||||
|
emit('update-data', data)
|
||||||
}
|
}
|
||||||
const onBlur = () => {
|
const onBlur = () => {
|
||||||
edit.value = false
|
edit.value = false
|
||||||
@@ -56,6 +57,10 @@
|
|||||||
const onMouseDown = (e: MouseEvent) => {
|
const onMouseDown = (e: MouseEvent) => {
|
||||||
if (edit.value) e.stopPropagation()
|
if (edit.value) e.stopPropagation()
|
||||||
}
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
inputRef.value.innerHTML = data.text
|
||||||
|
emit('update-data', data)
|
||||||
|
})
|
||||||
defineExpose({ data })
|
defineExpose({ data })
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -69,6 +74,7 @@
|
|||||||
> .input {
|
> .input {
|
||||||
outline: none;
|
outline: none;
|
||||||
min-width: 1px;
|
min-width: 1px;
|
||||||
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -32,6 +32,7 @@
|
|||||||
v-bind="node.data"
|
v-bind="node.data"
|
||||||
@delete-node="deleteNode(node.id)"
|
@delete-node="deleteNode(node.id)"
|
||||||
@copy-node="copyNode(node.id)"
|
@copy-node="copyNode(node.id)"
|
||||||
|
@update-data="(v) => (node.data.data = v)"
|
||||||
/>
|
/>
|
||||||
</node>
|
</node>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Reference in New Issue
Block a user