vue点击按钮打开新页签,并传参

10 篇文章 0 订阅

今天遇到一个新需求,需要打开新页签展示,之前用ruter.push都不管用,现在结合window.open和$router.resolve亲测有效
以下附上代码:

<div class="target" @click="ceshi" ref="target">测试</div>


ceshi() {
      let routeData = this.$router.resolve({
        path: "/tui",
        query: {
          name: "heihei",
          sex: "女"
        }
      });
      window.open(routeData.href, "_blank");
    }
  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Vue Electron中,要打开一个新窗口并传递参数,可以使用ipcRenderer和ipcMain来实现进程间通信。 首先,在主进程的main.js文件中,需监听来自渲染进程的事件,并处理传递的参数。可以使用ipcMain.on函数监听事件,并通过event.sender.send函数将数据传递给渲染进程。 ```javascript // main.js const { app, BrowserWindow, ipcMain } = require('electron') let mainWindow function createWindow() { // 创建主窗口 mainWindow = new BrowserWindow({width: 800, height: 600}) mainWindow.loadURL('your_app_url') // 监听事件 ipcMain.on('openNewWindow', (event, data) => { // 创建新窗口 const newWindow = new BrowserWindow({width: 400, height: 300}) newWindow.loadURL('your_new_window_url') // 传递参数给新窗口 newWindow.webContents.on('did-finish-load', () => { newWindow.webContents.send('passedData', data) }) }) } app.on('ready', createWindow) ``` 然后,在Vue组件中,使用ipcRenderer.send函数将事件和参数传递给主进程。 ```javascript // YourComponent.vue methods: { openNewWindowWithData() { const data = 'your_data' ipcRenderer.send('openNewWindow', data) } } ``` 最后,在新窗口的Vue组件中,监听对应的事件,并处理接收到的参数。 ```javascript // NewWindowComponent.vue mounted() { ipcRenderer.on('passedData', (event, data) => { // 处理接收到的参数 console.log(data) }) } ``` 通过以上的步骤,你可以使用Vue Electron在主窗口和新窗口之间进行数据传递,并打开一个新窗口并传递参数。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值