普通js文件里面如何访问vue实例this指针
目录
- 普通js文件里访问vue实例this指针
- then使用函数无法访问vue实例化的this
- 问题
- 原因
- 解决
普通js文件里访问vue实例this指针
main.js 文件,暴露出vue实例
Vue.use(VueAxios) const vue = new Vue({ router, store, created: bootstrap, render: h => h(App) }).$mount('#app') export default vue
js 文件中,使用实例
import vue from '@/main' vue.$message.success('成功')
then使用函数无法访问vue实例化的this
问题
原因
以上代码,使用匿名函数的写法
匿名函数的指针指向------函数操作的本身(不可以使用组件中声明的变量或者函数)
解决
以上为个人经验,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
改变javascript函数内部this指针指向的三种方法
在查了大量的资料后,我总结了下面的三条规则,这三条规则,已经可以解决目前我所遇到的所有问题.规则0:函数本身是一个特殊类型,大多数时候,可以认为是一个变量. 复制代码 代码如下: function a() { alert(this); } 或者 var a = function() { alert(this); } 都可以认为是创建了一个变量,这个变量的值就是一个函数. 规则1:如果一个函数,是某个对象的key 值,那么,this就指向这个对象. 这个规则很好理解: 复制代码 代码如下: var
-
JavaScript中的this基本问题实例小结
本文实例讲述了JavaScript中的this基本问题.分享给大家供大家参考,具体如下: 在函数中 this 到底取何值,是在函数真正被调用执行的时候确定下来的,函数定义的时候确定不了. 执行上下文环境 : **定义**:执行函数的时候,会产生一个上下文的对象,里面保存变量,函数声明和this. **作用**:用来保存本次运行时所需要的数据 当你在代码中使用了 this,这个 this 的值就直接从执行的上下文中获取了,而不会从作用域链中搜寻. 关于 this 的取值,大体上可以分为以下几种情况
-
基于Vue中this.$options.data()的this指向问题
目录 this.$options.data()的this指向问题 vue文档中有关于data的指向问题的解释 vue骚操作之this.$options.data() 重置vue组件的data数据 小结一下 this.$options.data()的this指向问题 项目里遇到一个问题,用this.$options.data()重置组件data时报错,原因是因为form里的rule规则采用了this写法. 如下: rules: { code: [this.$rules.requir
-
如何在JS文件中获取Vue组件
1. 背景 最近在写项目时候遇到这样一个需求: 我封装了一个js文件 utils.js,然后在组件 my-component.vue 中引用了该js文件. 在 utils.js 文件中有一些函数,需要操作 my-component.vue 中的 data 和 methods. 为了方便理解,上述 js 文件和组件名非实际工程中的名字,仅是示例. 2. 思路 通过调用函数把 组件实例 this 传递到 被应用的 js 文件 里. 3. 目录结构 src/ ├── App.vue ├── asset
-
普通js文件里面如何访问vue实例this指针
目录 普通js文件里访问vue实例this指针 then使用函数无法访问vue实例化的this 问题 原因 解决 普通js文件里访问vue实例this指针 main.js 文件,暴露出vue实例 Vue.use(VueAxios) const vue = new Vue({ router, store, created: bootstrap, render: h => h(App) }).$mount('#app') export default vue js 文件中,使用实例
-
vue项目中在外部js文件中直接调用vue实例的方法比如说this
一般我们都是在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
-
解决Vue-cli3没有vue.config.js文件夹及配置vue项目域名的问题
1.在vue项目根目录下新建vue.config.js(不是在src下面) vue.config.js配置文件: module.exports = { // 基本路径 baseURL已经过时 publicPath: './', // 输出文件目录 outputDir: 'dist', // eslint-loader 是否在保存的时候检查 lintOnSave: true, // use the full build with in-browser compiler? // https://vu
-
Node.js 文件夹目录结构创建实例代码
第一次接触NodeJS的文件系统就被它的异步的响应给搞晕了,后来发现NodeJS判断文件夹是否存在和创建文件夹是还有同步方法的,但是还是想尝试使用异步的方法去实现. 使用的方法: fs.exists(path, callback); fs.mkdir(path, [mode], callback); 实现文件夹目录结构的创建代码实现如下: //创建文件夹 function mkdir(pos, dirArray,_callback){ var len = dirArray.length; con
-
详解js文件通过python访问数据库方法
我来教你 js文件怎么通过python访问数据库,希望能够为你带来帮助. 1.如果是要提交表单内容给 服务器的 python 处理,那么只需要在表单 <form> 里面的 action 填写服务端的处理路由就可以了.或者用 <a> 指向服务器路由get querystring.前端方面不需要python啊. 2.前端的提交交互动作,都是由 javascript 处理就可以,远程登录ssh之后,那个web页面可以通过url访问还是服务器上可以直接读取的文件? 3.如果是前者,就等于p
-
VUE项目中引入JS文件的方法总结
目录 1.在index.html页面使用script标签引入 2.在main.js中使用window.moduleName 使用 3.手动添加export 4. 使用import方式,把需要的js库中的方法挂载到全局 补充:Vue3如何引用全局JS文件 总结 在开发Vue项目的时候,有时需要使用一些非ES6格式的没有export的js库,可以有如下方法实现: 1.在index.html页面使用script标签引入 当然也可以使用cdn的地址.这样引入后的内容是全局的,可以在所有地方使用. <!D
-
Vue创建项目后没有webpack.config.js(vue.config.js)文件的解决
目录 webpack.config.js文件没有的原因 手动创建一个 vue.config.js 没有配置vue.config.js之前,打包后的文件如下 配置后 总结 webpack.config.js文件没有的原因 Vue 项目中 vue.config.js 文件就等同于 webpack 的 webpack.config.js. vue-cli3 之后创建的时候并不会自动创建 vue.config.js,因为这个是个可选项,所以一般都是需要修改 webpack 的时候才会自己创建一个 vue
-
Vue 实例事件简单示例
本文实例讲述了Vue 实例事件.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Vue 实例事件</title> <script type="text/javascript" src="https://cdn.bootcss.com/v
-
js读取json文件片段中的数据实例
在html中利用js读取动态网站从服务器端返回的数据进行显示 1.js.html 页面 需要引入 执行jquery的js文件 <HTML> <HEAD> <META name=Generator content=EditPlus> <META name=Author content=""> <META name=Keywords content=""> <META name=Description c
随机推荐
- Windows下Redis的安装使用教程
- java微信企业号开发之通讯录
- Python之PyUnit单元测试实例
- C++中BitBlt的使用方法详解
- js 日期比较相关天数代码
- CSS渐变文本效果的两种方法比较
- 创建Flash站点的十大可用性技巧(转)
- 基于jquery的气泡提示效果
- jQuery中clearQueue()方法用法实例
- jQuery模拟物体自由落体运动(附演示与demo源码下载)
- 适用于php-5.2 的 php.ini 中文版[金步国翻译]
- Android通过SOCKET下载文件的方法
- JavaScript DOM学习第四章 getElementByTagNames
- SEO搜索引擎优化常用密度查询网址集合
- Android学习项目之简易版微信为例(一)
- 老生常谈java路径中的反斜杠和斜杠的区别
- php中hashtable实现示例分享
- 如何使用C#操作幻灯片
- Java 11 正式发布,这 8 个逆天新特性教你写出更牛逼的代码
- 学习RxJS之JavaScript框架Cycle.js