как предотвратить обновление элемента объекта HTML с атрибутом связанных данных после полного экрана в браузере "samsung inte rnet"

Question

Я связал атрибут данных элемента объекта HTML в компоненте Vue, и у меня есть полноэкранная кнопка для отображения моего объекта в полноэкранном режиме.

нет проблема в chrome или других браузерах, но когда я пытаюсь отобразить свой объект в полноэкранном режиме в браузере Samsung inte rnet, мой объект повторно подключается, и мне нужно обновить sh страницу.

Я наблюдал «gameLink», и он никогда не меняется на «toggleFullScreen», он только один раз изменяется на созданном хуке при его инициализации.

как я могу предотвратить повторное подключение?

вот код:

        <b-nav-form>
            <b-button id="fullscreen-btn" @click="toggleFullScreen">
                <font-awesome-icon icon="expand" />
            </b-button>  
            <b-tooltip target="fullscreen-btn" placement="bottom" variant="warning">Full screen</b-tooltip>
        </b-nav-form>

. , , .

    <div class="game-screen-size">
        <div id="target" style="width:100%; height:100%;">
             <div v-if="fullscreen" style="position:fixed; top:15px; left:50%; z-index:1500">
                <b-button id="compress-btn" @click="toggleFullScreen">
                    <font-awesome-icon icon="compress" />
                </b-button>  
                <b-tooltip target="compress-btn" placement="bottom" variant="warning">Normall view</b-tooltip>
            </div>
            <object type="text/html" class="game-screen" :data="gameLink"></object>
        </div>
    </div>

. , , .

computed: {
    ...mapState("playGame", ["status", "gameLink", "userGameInfo", "activeTables", "emptyTables"]),
  },
methods: {
   ...mapActions("playGame", ["play", "userInfo", "tablesData"]),
    toggleFullScreen () {
        // toggle full screen using screenfull
        const element = document.getElementById('target');
        screenfull.toggle(element);
        this.fullscreen = !this.fullscreen;
      },
   }
created() {
    //gets the link and sets the gameLink on vuex store
    this.play();
}

....

видео проблемы:

https://youtu.be/uIZuFwRqMKQ

Answer 1

Я использовал iframe вместо объекта и проблема решена!