动态组件使用

动态组件使用动态组件官网说明，通过使用保留的元素，动态绑定其is属性，让多个组件使用同一个挂载点，动态切换：varvm=newVue({el:'#example',data:{currentView:'home'},components:{home:{/*...*/},posts:{/*...*/},archive:{/*...*/}}})也可以直接绑定到组件对象：varHome={template:'

Welcomehome!

'}varvm=newVue({el:'#example',data:{currentView:Home}})在实际项目开发中引入componentimportsubmitmodalfrom'../components/SubmitModal'；动态组件：正在绑定ok="submitModal.onOk":type="submitModal.type":hasinput="submitModal.hasInput":input.sync="submitModal.input">数据参数submitModal:{title:'',show:false,hasInput:false,showError:false,文本:'',type:'',onOk:function(){}},currentView:''4.显示组件letself=this;self.submitModal.show=true;self.submitModal.title='批准被拒绝';self.submitModal。输入='删除';self.submitModal.hasInput=true;self.submitModal.text='请填写拒绝原因';self.submitModal.onOk=makeFail;self.currentView='';setTimeout(()=>{self.currentView='submitmodal';},1);关闭组件on-okself.submitModal.show=false;item.hideOrder=true;setTimeout(function(){self.submitModal.input='';},200);setTimeout(function(){self.submitModal.showError=false;},400);on-closeclosesubmitModal:function(){this.currentView='';this.submitModal.input='';this.submitModal.show=false;}