vue-router 如何在新窗口打开页面

1. 标签实现新窗口打开

官方文档中说 v-link 指令被 组件指令替代，且 不支持 target=”_blank” 属性，如果需要打开一个新窗口必须要用标签，但事实上vue2版本的 是支持 target=”_blank” 属性的(tag=”a”)，如下：

1

<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新页面打开home页</router-link>

2.编程式导航

有些时候需要在单击事件或者在函数中实现页面跳转，那么可以借助router的示例方法，通过编写代码实现。我们常用的是 $router.push 和 $router.go 但是vue2.0以后，这种方式就不支持新窗口打开的属性了，这个时候就需要使用this.$router.resolve,如下：

1
2
3
4
5
6
7

seeShare(){
  let routeUrl = this.$router.resolve({
      path: "/share",
      query: {id:96}
  });
  window.open(routeUrl .href, '_blank');
}

阅读更多

Commonly-used-to-collect

🎉 整理我平时关注的前端库。

导航：

1.Vue

• API
• UI库
• 实用库
• 应用实例
• Demo示例

2.React

• API
• UI库
• 实用库

3.小程序

• 微信
• 支付宝
• 今日头条
• 百度

4.webpack

5.typeScript

阅读更多

vuex中，有默认的五种基本的对象

1.state：存储状态（变量）
2.getters：对数据获取之前的再次编译，可以理解为state的计算属性。我们在组件中使用 $sotre.getters.fun()
3.mutations：修改状态，并且是同步的。在组件中使用$store.commit(‘’,params)。这个和我们组件中的自定义事件类似。
4.actions：异步操作。在组件中使用是$store.dispath(‘’)
5.modules：store的子模块，为了开发大型项目，方便状态管理而使用的。这里我们就不解释了，用起来和上面的一样。

阅读更多

问题

1
2
3

如果提交了一个错误的版本，怎么回退版本？
如果提交了一个错误的版本到远程分支，怎么回退远程分支版本？
如果提交了一个错误的版本到公共远程分支，又该怎么回退版本？

阅读更多

React子组件和父组件通信

1. 子组件获取父组件属性：props或者state
2. 子组件调用父组件的方法
3. 父组件获取子组件的属性：props或者state
4. 父组件调用子组件的方法

阅读更多

GitBook 是一个基于 Node.js 的命令行工具，支持 Markdown 和 AsciiDoc 两种语法格式，可以输出 HTML、PDF、eBook 等格式的电子书

1

npm install -g gitbook-cli

Typora 下载地址：https://typora.io/
Git 下载地址：https://git-scm.com/downloads

阅读更多

移动端和h5的混合开发模式，在h5中调用原生的方法来获取数据的交互特别多，但是提示比较困难，因为在应用中不像浏览器，无法打开控制台，改如何调试呢？

use

1
2
3
4

npm install vconsole

import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole
let vConsole = new VConsole() // 初始化

阅读更多

之前买的阿里的云服务器，太贵了没钱续费，github的博客免费，代码托管上去，只需要买个域名甚至不买也行，挺合适，就是访问速度慢点，百度也不收录，但是这些也有解决的办法，具体的解决办法本文不介绍了，以后有时间可以再具体说一说，暂时也可以自己用，反正主要也是自己记录，不求他能有多高的baidu排名。

1.准备条件
2.设置本地博客的配置
3.初始化hexo
4.上传项目

阅读更多

vue 的组件在vue框架中是特别重要的一个环节，在大型的项目中，组件显的相当的重要，这样在后期特别好维护，一块内容就是一个组件，随时随地的删除和修改不同的组件，接下来我想写一篇vuex 集中管理状态，所以在之前先简单的介绍一下vue组件之间的相互传参方式。

1
2
3
4
5

父传子：Props
子传父：子：$emit(eventName)  父$on(eventName)
父访问子：ref
非父子组件通信:https://vuefe.cn/guide/components.html#非父子组件通信
vue2.0 移除：1.$dispatch() 2.$broadcast() 3.events

阅读更多