How does the template of vue set the same root node for multiple li, except for ul

    var eleInput=Vue.extend({
        template: "\
            <li class="form-item">\
                <h4 class="form-title">{{title}}</h4>\
                  <input type="text"  v-model="name" >\
                <i class="icon pen"></i>\
            </li>\
            \<li class="form-item" v-for="(v,k) in Arr" :key="k" v-on:click="setName(v)">{{v}} </li> \
        \ ",

I"m going to insert this component in a ul. Because there are other li, in this ul, these two li cannot have ul or div as the root node. How to set the same root node? what"s the solution?

Mar.04,2021

split into two components

Menu