vueiframe能嵌入网址吗?
可以的,
代码示例:
<template>
<divid=\"app\">
<iframe
:width=\"searchTableWidth\"
:height=\"searchTableHeight\"
v-bind:src=\"reportUrl\"
></iframe>
</div>
</template>
<script>
importVuefrom'vue'
exportdefault{
methods:{
widthHeight(){
this.searchTableHeight=window.innerHeight-146;
this.searchTableWidth=window.innerWidth-280
},
},
data(){
return{
reportUrl:'',
searchTableHeight:0,
searchTableWidth:0
}
},
mounted(){
window.onresize=()=>{
this.widthHeight();//自适应高宽度
};
this.$nextTick(function(){
this.widthHeight();
});
},
created(){
//从路由里动态获取url地址具体地址看libs下util.js里的backendMenuToRoute方法
this.reportUrl=this.$route.meta.pathUrl
},
watch:{
'$route':function(){
//监听路由变化
this.reportUrl=this.$route.meta.pathUrl
}
}
}
</script>
绛旓細鍙互鐨锛屼唬鐮佺ず渚嬶細<template> <divid=\"app\"> <iframe :width=\"searchTableWidth\":height=\"searchTableHeight\"v-bind:src=\"reportUrl\"></iframe> </div> </template> <script> importVuefrom'vue'exportdefault{ methods:{ widthHeight(){ this.searchTableHeight=window.innerHeight-14...
绛旓細涓涓綉绔欑敤iframe锛屽祵鍏ュ彟涓涓綉绔檝ue鐨剈rl鑳藉祵鍏ョ殑銆傚缓璁娇鐢ㄥ井鍓嶇宓屽锛屾垨鑰呭皢闇瑕佸祵濂楃殑椤甸潰鎵撳寘濂藉悗鍐嶅祵濂椼傚洜涓烘槸涓や釜vue椤圭洰锛岀幇鍦ㄨ彍鍗曠郴缁熺殑vue椤圭洰浣跨敤iframe鏉ュ祵鍏ュ彟涓鍐呭vue椤圭洰銆傜櫥褰曞緱鍒扮殑token涓嶈兘鍏变韩銆傝В鍐虫濊矾锛氫娇鐢╬ostMessage鎶婅彍鍗曢」鐩殑token浼犻掔粰鍐呭vue椤圭洰銆
绛旓細vue浣跨敤iframe鍙兘宓屽涓灞備笉濂銆傚綋澶氭鏇存敼iframe->src灞炴у悗锛岃皟鐢╮outer.go鏄礋涓锛屼笉鑳藉疄鐜拌矾鐢卞悗閫涓婁竴绾э紝鑰屾槸灏唅frame褰撲綔涓涓獥鍙f枃妗o紝璋冪敤浜嗚绐楀彛鏂囨。鐨剋indow.history.go璐熶竴锛屽苟鏈洿鏀圭埗绾ч」鐩殑璺敱鍚庨鍔熻兘銆
绛旓細vueiframe涓嶅彲浠ョ洃鍚埌椤甸潰涓嶈兘鎵撳紑銆傚祵鍏ョ殑椤甸潰鏃犳硶鎵撳紑鎴栧姞杞斤紝鏈韩鏃犳硶鐩存帴鎹曡幏鐩稿叧鐨勯敊璇傚彲浠ヨ冭檻浣跨敤JavaScript鐨刼nerror浜嬩欢锛屾垨鑰呴氳繃涓庡祵鍏ョ殑椤甸潰杩涜閫氫俊鐨勬柟寮忥紝浠ュ垽鏂槸鍚﹁兘澶熸垚鍔熷姞杞介〉闈俈ue鏄竴涓祦琛岀殑鍓嶇JavaScript妗嗘灦锛岀敤浜庢瀯寤虹敤鎴风晫闈傚畠鏄竴涓笎杩涘紡妗嗘灦锛屼笓娉ㄤ簬瑙嗗浘灞傦紝鍙互涓庣幇鏈夐」鐩泦...
绛旓細1銆侀鍏堬紝灏濊瘯鎵嬪姩璺宠浆璺敱銆2銆佸叾娆★紝鏃犳硶瑙e喅鐨勮瘽锛岃浣跨敤Vue-Router鎻愪緵鐨勫姛鑳斤紝闇瑕侀氳繃npm鎴杫arn杩涜瀹夎锛屽湪椤圭洰涓紩鐢ㄥ苟鍒涘缓Vue-Router瀹炰緥锛屽嵆鍙烦杞矾鐢便
绛旓細閫氳繃 server绔彂甯冩姤琛紝鍙互渚涘墠绔〉闈㈠唴宓岋紝鍐呭祵鏈変袱绉嶆柟寮忥紝➀tableau瀹樻柟鎻愪緵鐨刯s api锛➁iframe宓屽叆鐨勬柟寮忥細鈪.濡備綍鍦ㄤ竴涓〉闈㈠唴宓屽涓猼ableau鎶ヨ〃锛氫笂闈㈢殑鎯呭喌閮芥槸閽堝鍐呭祵涓涓猼ableau鎶ヨ〃鐨勬儏鍐碉紝瀹為檯搴旂敤涓亣鍒拌繃闇瑕佸崟涓〉闈㈠唴宓屽涓姤琛紝鍙互鑰冭檻濡備笅鏂瑰紡銆
绛旓細鍗曠偣鐧诲綍锛氶氳繃CAS銆丄D鍩熺瓑鏂瑰紡锛屽畬鎴愬崟鐐圭櫥褰曟姤琛ㄩ泦鎴愶細姣忎釜鐢靛瓙琛ㄦ牸鎶ヨ〃閮芥槸涓涓猆RL锛鍙互閫氳繃URL閾炬帴灏嗘姤琛宓屽叆鍒扮涓夋柟绯荤粺涓 Smartbi浠庢姤琛ㄥ紑鍙戠殑鏁版嵁鍑嗗銆佹牱寮忚璁°佹暟鎹绠椼佹暟鎹彲瑙嗗寲銆佷簰鍔ㄩ昏緫銆佸叡浜彂甯冨叚澶ф楠や笂閮芥湁鐗硅壊鐨勫姛鑳斤紝鍏呭垎鍒╃敤浜咵xcel鐨勭幇鏈夎兘鍔涳紝鍫О浼佷笟鎶ヨ〃骞冲彴鐨勮В鍐虫柟妗堜笓瀹躲傚挨鍏...