资讯专栏INFORMATION COLUMN

vue项目中如何在外部js文件中直接调用vue实例——比如说this

hover_lew / 1210人阅读

摘要:一般我们都是在中引入,然后在文件中直接使用指向的是实例,但是在实际开发中,我们往往会引入外部的文件使用,这个就会指向,并不是我们期待的实例,那么就需要重新引入文件这样很麻烦。在目前项目中我使用的方法是导出实例,然后在需要使用的中引入。

一般我们都是在main.js中引入vue,然后在vue文件中直接使用this(this指向的是vue实例),但是在实际开发中,我们往往会引入外部的js文件使用this,这个this就会指向window,并不是我们期待的vue实例,那么就需要重新引入vue文件(import Vue from "vue"),这样很麻烦。在目前项目中我使用的方法是mian.js导出vue实例,然后在需要使用的js中引入。
步骤一:main.js导出vue实例

var vue = new Vue({
  el: "#app",
  router,
  components: { App },
  template: ""
})
export default vue

步骤二、在需要使用的js中引入

import context from "../main.js"
context.$router.push("/login")

参考地址:
https://blog.csdn.net/weixin_...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103947.html

相关文章

  • 基于 Vue 的后台管理系统前端实践

    摘要:输入框内容过滤产品有一个需求是,在搜索用户信息时,只能通过邮箱搜索,并且只能输入字母数字以及。我选择了输入框的值这里的坑就是需要在中更新值,因为元素这时才刷新。是否有一定要用的必要类似的管理系统涉及到不同页面之间的交互都很少。 初始化项目 使用 Vue-cli3 初始化项目1 安装 Element UI安装 Vue-i18n,做相关配置2,3 原则上需要对 Element 也做 I18...

    scwang90 评论0 收藏0
  • vue2实践(持续更新)

    摘要:记录一些小技巧和踩过的坑由于本篇文章内容太多,导致编辑器有点卡,所以新开辟了一篇实践二,后续再这里更新。组件的生命周期函数是在标签里的数据发生变化时候触发数据可能更新了,但是没有绑定到上面的话,不会调用钩子函数。 记录一些小技巧和踩过的坑 由于本篇文章内容太多,导致SF编辑器有点卡,所以新开辟了一篇 vue2实践(二),后续再这里更新。 1. props 带不带冒号的区别 ...

    n7then 评论0 收藏0
  • VueJS学习使用Vuex详解

    摘要:在单页面组件的开发中的和的都统称为同一状态管理,个人的理解是全局状态管理更合适简单的理解就是你在中定义了一个数据之后,你可以在所在项目中的任何一个组件里进行获取进行修改,并且你的修改可以得到全局的响应变更。 在SPA单页面组件的开发中 Vue的vuex和React的Redux 都统称为同一状态管理,个人的理解是全局状态管理更合适;简单的理解就是你在state中定义了一个数据之后,你可以...

    JessYanCoding 评论0 收藏0
  • VueJS学习使用Vuex详解

    摘要:在单页面组件的开发中的和的都统称为同一状态管理,个人的理解是全局状态管理更合适简单的理解就是你在中定义了一个数据之后,你可以在所在项目中的任何一个组件里进行获取进行修改,并且你的修改可以得到全局的响应变更。 在SPA单页面组件的开发中 Vue的vuex和React的Redux 都统称为同一状态管理,个人的理解是全局状态管理更合适;简单的理解就是你在state中定义了一个数据之后,你可以...

    qc1iu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<