首页 > 解决方案 > Javascript页面刷新并保留参数

问题描述

我有这个页面的参数来自上一页。当我刷新页面时,参数将消失,并且不会显示 youtube 视频。

你可以从这里的 url 看到这个效果:https ://gamecrawl.com/play/xOqFjTR9LG0

{
    path: "/play/:id?",
    component: _644a45f8,
    name: "play-id"
  },

有没有办法保留它们以便正确显示视频?

<template>
  <div>
    <h1 class="text-5xl mt-6">{{ $route.params.title }}</h1>

    <div class="bg-gray-100">
      <div class="flex content-center px-16 py-8 mt-2">
        <iframe
          width="854"
          height="480"
          :src="youtubeurl"
          frameborder="0"
          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
          allowfullscreen
        ></iframe>
      </div>

      <p class="p-8">
        {{ $route.params.description }}
      </p>
    </div>
  </div>
</template>

<script>
export default {
  props: ["ytid", "description", "title"],
  mounted() {
    console.log("item id");
    console.log(this.ytid);
  },
  computed: {
    youtubeurl() {
      return "https://youtube.com/embed/" + this.$route.params.ytid;
    }
  }
};
</script>

<style scoped></style>

标签: javascriptvue.jsnuxtjs

解决方案


推荐阅读