I have a reactive variable list either ref or reactive
in a vue.Js project
and i create an app that depends on this list(reactive)
let list = ref(['item']);
let vNode = h(
'ul',
list.value.map((v, i) => { return h('li', { key: i }, v) })
);
let customApp = createApp(vNode);
customApp.mount('#trial')
when list changes the mounted component doesn't change, how can i make it dynamic and sync with list?
the problem was solved using a component not a vnode.
let list = ref(['item']);
const comp = defineComponent({
setup() {
const arr = computed(() => toastsList.value);
// or use list.value directly
return () => h('ul',arr.value.map((v, i) => { return h('li', { key: i }, v) }));
},
});
createApp(comp).mount('#trial');