动态添加页面
方式一:
<div><span class="smartText2" style="margin-top: 60px;" @click="handleTips('近期俄乌事件的态势分析')">近期俄乌事件的态势分析</span></div>
<div><span class="smartText2" @click="handleTips('俄乌时间时间线分析')">俄乌时间时间线分析</span></div>
<!-- <div><span class="smartText2" @click="handleTips('近期俄乌武器装备对比')">近期俄乌武器装备对比</span></div> -->
<!-- <qbzh-agent-image></qbzh-agent-image>
<qbzh-agent-table></qbzh-agent-table>
<qbzh-time></qbzh-time>
<qbzh-text></qbzh-text> -->
添加的页面就在这个之前
<div ref="targetElement"></div>
var qbzhAgentTableComponent = Vue.extend(qbzhAgentTable); //qbzhAgentTable 需要引的页面
var qbzhAgentTableInstance = new qbzhAgentTableComponent({
propsData: {
data : dddd // 给页面传入的参数
}
});
qbzhAgentTableInstance.$mount();
this.$refs.targetElement.insertAdjacentElement('beforebegin', qbzhAgentTableInstance.$el); // beforebegin 在targetElement之前加入页面
qbzhAgentTableInstance.$forceUpdate();
方式二:
this.question = document.getElementById('qbzhInput').value
this.smartText = '正在为您'+this.question
var parentDiv = document.getElementById('chat')
parentDiv.innerHTML += `<div class="my-que">
<div class="que-text">
${this.question}
</div>
<div class="que-logo-r"></div>
</div>
`
window.localStorage.setItem("questionText", this.question);
console.log(typeof window.localStorage["questionText"]);
console.log('get', window.localStorage.getItem("questionText"));
this.question = ''
var qbzhFiveVueVueComponent = Vue.extend(qbzhFiveVue);
var qbzhFiveVueInstance = new qbzhFiveVueVueComponent(
propsData: {
data : dddd // 给页面传入的参数
});
parentDiv.appendChild(qbzhFiveVueInstance.$mount().$el);