I use vue3 composition API and <script setup>
.
<textarea v-model="textarea"></textarea>
<button @click="showPreview">click</button>
<p ref="p" v-if="open"></p>
const textarea = ref("");
const p = ref(null);
const open = ref(false);
function showPreview() {
let text = textarea.value.replaceAll(/n/g, "<br>");
if (p.value) { // p is null
p.value.innerHTML = text;
}
open.value = true;
}
I want to show textarea’s text in p
tag(not using v-html) when click button.
But p
is null in function…
I tried check p variable in onMounted function but it still null.
onMounted(() => console.dir(p))
How can I access ref element when click event?
Thanks in advance for any help.