baozhengrui

导航

动态添加页面

方式一:



  <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);

posted on 2024-08-12 15:11  芮艺  阅读(3)  评论(0编辑  收藏  举报