亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Rails vuejs 獲取 iframe 元素的高度

Rails vuejs 獲取 iframe 元素的高度

浮云間 2023-02-17 15:50:21
我正在使用vuejswebpackerrails和turbolinks. iframe我想在初始頁面加載時計算元素的正確高度。目前,我在手動刷新頁面時獲取元素的高度,而當有人從任何其他頁面導航到元素所在的頁面時,不會iframe計算元素的高度。我的index.js設置:Vue.use(TurbolinksAdapter);document.addEventListener('turbolinks:load', () => {  const app = new Vue({    el: '[data-behaviour="vue"]',  });});我的preview.vue元素iframe所在的位置。data() {    return {      frameHeight: '',    };  },   computed: {    computeHeight() {      this.frameHeight =        this.$refs.iframe.contentWindow.document.body.scrollHeight + 'px';    },  },  mounted() {    window.addEventListener('load', () => {      this.computeHeight;    });  },我也嘗試用mounted鉤子替換created鉤子,而不是監聽事件load我也嘗試監聽turbolinks:load事件。但它不起作用。任何幫助,將不勝感激。謝謝。
查看完整描述

2 回答

?
郎朗坤

TA貢獻1921條經驗 獲得超9個贊

嘗試像這樣在 nextTick 中包裝計算高度代碼:


data() {

    return {

      frameHeight: '',

    };

  },

  mounted() {

    this.$nextTick(() => { 

      window.addEventListener('load', () => {

        this.frameHeight =

          this.$refs.iframe.contentWindow.document.body.scrollHeight + 'px';

      });

    })

  },

這應該允許元素在執行代碼以獲取高度之前加載。


查看完整回答
反對 回復 2023-02-17
?
嗶嗶one

TA貢獻1854條經驗 獲得超8個贊

使用 nextTick 時不需要 eventListener。你可以這樣做:


data() {

    return {

      frameHeight: '',

    };

  },

  mounted() {

    this.$nextTick(() => { 

      this.frameHeight = 

          this.$refs.iframe.contentWindow.document.body.scrollHeight + 'px';

    });


  },


查看完整回答
反對 回復 2023-02-17
  • 2 回答
  • 0 關注
  • 244 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號