鍍金池/ 問(wèn)答/HTML/ 在vue-cli工程中,已經(jīng)創(chuàng)建好了組件,如何實(shí)現(xiàn)動(dòng)態(tài)添加掛載

在vue-cli工程中,已經(jīng)創(chuàng)建好了組件,如何實(shí)現(xiàn)動(dòng)態(tài)添加掛載

import RoomNeed from './RoomNeed.vue',

創(chuàng)建了一個(gè)RoomNeed的組件,想實(shí)現(xiàn)點(diǎn)擊綠色加號(hào)按鈕,動(dòng)態(tài)添加RoomNeed 組件到指定的div元素中
圖片描述

圖片描述

然后加號(hào)按鈕的組件一直存在,點(diǎn)擊n次則添加n次組件,不清空原來(lái)的組件內(nèi)容,
點(diǎn)擊減號(hào)按鈕,則刪除對(duì)應(yīng)的組件。

考慮過(guò)通過(guò)數(shù)組實(shí)現(xiàn),但是組件好像不能push進(jìn)數(shù)組,render函數(shù)渲染的時(shí)候,無(wú)法渲染。
折騰一中午了,求大神助攻

回答
編輯回答
誮惜顏

vue的核心思想是通過(guò)數(shù)據(jù)來(lái)決定view層的展示

data() {
    return {
     myData: [1,2,3,4]
    }
}

<RoomNeed v-for="item in myData" />

//添加

this.myData.push(1)

// 刪除

this.myData.splice(this.myData.length-1)
2018年9月5日 18:33
編輯回答
莫小染

你可以看下vue v-is指令的使用說(shuō)明

2017年11月8日 03:33