I have registered a component and want to add this component to ul by clicking the button, and it can be rendered successfully. I would like to ask what to do (or my idea is wrong) for example:
<div id="test">
<button v-on:click="AddItem"></button>
<ul></ul>
</div>
<script type="text/javascript">
Vue.component("list-test",{
template:`<li v-if="seen">123<button v-on:click="seen=!seen" >Delete</button></li>`,
data:function(){
return {seen:true}}
,
})
new Vue({
el:"-sharptest",
data:{},
methods:{}
})
</script>
usually you can directly
- < list-test > < / list-test >
because I don"t know how to add it with vue.js. I tried it .
methods:{
AddItem:function(){
var list =document.querySelector("ul");
var listChild=document.createElement("list-test");
list.appendChild(listChild)
}
check and find that there is a < list-test > tag in html but it is not rendered