admin 管理员组

文章数量: 887021

第一种：浏览器打开一个新窗口

//模板传值到编辑器
<script lang="ts" setup>
import { useRoute, useRouter } from "vue-router";
const router = useRouter();
const route = useRoute();
const jumpPhoto = (item: any) => {
  const {href} =  router.resolve({
    path:'/photo-editor',//路径
    query:{
      moId: item.moId,
      sceneId: item.sceneId,
      proId: item.proId,
    }//传参
  });
  window.open(href)
};
</script>

接收参数

<script lang="ts" setup>
import { onMounted } from "vue";
import { useRoute } from "vue-router";
const route = useRoute();
onMounted(()=>{
  console.log(route.query,"我的作品编辑器")
})
</script>

 

第二种：在页面弹出新窗口

//跳到模板详情页
<script lang="ts" setup>
import { useRoute, useRouter } from "vue-router";
const router = useRouter();
const route = useRoute();
const details = (item: any) => {
  const id = reactive({
    moId: item.moId,
  });
// name: "groupSettings"要跳的页面
// query: id要传的参数
// params: { a: route.path }当前页面的路径
  router.push({ name: "groupSettings", query: id, params: { a: route.path } });
};
</script>

在另一个页面接收参数

<script lang="ts" setup>
import { onMounted } from "vue";
import { useRoute } from "vue-router";
const route = useRoute();
onMounted(() => {
  // console.log(route.query)收到另一页面传过来的参数
 //console.log(route.query)判断是从哪个页面过来的
  if (router.params.a == "/collectList") {

}
</script>

本文标签： 新窗口 弹出 写法 浏览器 参数

版权声明：本文标题：vue3.2版本 在浏览器打开一个新窗口 和 在页面弹出新窗口的写法（传参和接收参数） 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.freenas.com.cn/jishu/1727323414h1101717.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。