因配置的关系,导致 vue的data选项中存在事件。而事件无法获取 vue 的实例对象;项目是单文件形式的,以下代码只是例子

new Vue({
el:...,
data:{
a: {
onevent:function(){
//由于a是某个插件的根对象,所以这里无法获取 vue 的实例对象
}
}
}
})

 

方法一:

参考export用法文档:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/export

export default (()=>{
let defaultVue = {
data: {
a:{
b: function(){
// 这里可以使用defaultVue这个对象,不过,这里使用的就是js的对象,只能通过 defaultVue.data.propertyName 来获取值
}
}
}
};
return defaultVue;
})()

  

方法二(推荐):

vue Data选项的文档可以看一下:https://cn.vuejs.org/v2/guide/instance.html#%E6%95%B0%E6%8D%AE%E4%B8%8E%E6%96%B9%E6%B3%95

主要知道 想要vue的响应式驱动的方式的话,就在 data选项里声明一个 属性即可,再然后就需要了解一下 vue的声明周期了

第一步:

这里的 bind 方法,可以去 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/bind 这里看看,bind方法的意思就是绑定指定的上下文(注意,是bind返回的函数才绑定到你指定的上下文了,不会修改原函数的)

然后就 ok 了,这样就不需要声明全局的变量保存 vue实例了,不容易啊,琢磨近一天了

vue单文件组件data选项的函数体获取vue实例对象的更多相关文章

  1. Vue单文件组件

    前面的话 本文将详细介绍Vue单文件组件 概述 在很多 Vue 项目中,使用 Vue.component 来定义全局组件,紧接着用 new Vue({ el: '#container '}) 在每个页 ...

  2. webpack入坑之旅(五)加载vue单文件组件

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack,在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  3. vue 单文件组件

    在很多vue项目中,我们使用vue.component来定义全局组件,紧接着用new Vue({el:'#container'})在每个页面内指定一个容器元素 这种方式在很多中小规模的项目中运作的很好 ...

  4. 基于VSCode的vue单文件组件模板设置---一次设置,可爽终生

    第一步: 第二步: 第三步: 打开vue.json文件后,如果是初次设置,应该如下图所示,绿色注释部分不用管,注意那两个白色大括号 第四步:在大括号内全部粘贴如下代码,保存即可完成vue模板的设置 & ...

  5. vue 单文件组件最佳实践

    vue 单文件组件最佳实践 生命周期 template <template> <section> <h1>vue single file components te ...

  6. webpack打包vue单文件组件

    一.vue单文件组件 ①文件扩展名为 .vue 的 就是single-file components(单文件组件) ②参考文档:单文件组件 二.webpack加载第三方包 ①项目中,如果需要用到一些第 ...

  7. ts-loader如何与vue单文件组件衔接

    .ts-loader是如何与vue单文件组件衔接作用的 https://github.com/microsoft/TypeScript-Vue-Starter https://www.npmjs.co ...

  8. vue单文件组件的构建

    在很多Vue项目中,我们使用 Vue.component 来定义全局组件,这种方式在很多中小规模的项目中运作的很好. 但当在更复杂的项目中,就有了很大的弊端. 我们就可以用文件扩展名 .vue的单文件 ...

  9. Vue单文件组件基础模板

    背景 相信大家在使用Vue开发项目时,基本都是以单文件组件的形式开发组件的,这种方式好处多多: 1.代码集中,便于开发.管理和维护 2.可复用性高,直接将vue文件拷贝到新项目中 我暂时就想到这两点, ...

随机推荐

  1. 基于 Kafka 的实时数仓在搜索的实践应用

    一.概述 Apache Kafka 发展至今,已经是一个很成熟的消息队列组件了,也是大数据生态圈中不可或缺的一员.Apache Kafka 社区非常的活跃,通过社区成员不断的贡献代码和迭代项目,使得 ...

  2. 新建一个scrapy项目

    此次是做一个豆瓣的top250信息的抓取 首先打开pycharm 在pycharm的下端的Terminal中输入scrapy startproject douban 此时系统就生成了以下文件(spid ...

  3. Renix软件如何建立OSPF邻居——网络测试仪实操

    OSPF可以通过OSPF向导的方式方便的创建OSPF邻居, 也可以通过纯手工的方式创建OSPF邻居, 本文介绍的是纯手工的方式创建. 在工作中, 推荐使用OSPF向导的方式来创建, 会比较简单和高效. ...

  4. 利用while循环写的简单小游戏猜数字

    猜数字的大小游戏 C:\Users\Administrator>python Python 3.6.8 (tags/v3.6.8:3c6b436a57, Dec 23 2018, 23:31:1 ...

  5. JZ-014-链表中倒数第 K 个结点

    链表中倒数第 K 个结点 题目描述 输入一个链表,输出该链表中倒数第k个结点. 题目链接: 链表中倒数第 K 个结点 代码 /** * 标题:链表中倒数第 K 个结点 * 题目描述 * 输入一个链表, ...

  6. Spring注解简析

    JAVA 元注解 @Documented @Inherited @Retention @Target @Repeatable @Native 在java.lang.annotation包下,除了@Na ...

  7. 翻译 | 解读首部 Kubernetes 纪录片

    引言 Honeypot.io 自诩为欧洲最大的技术人才招聘平台,同时提供开发者视频网站,又被称其为 "开发者的 Netflix".2022 年 1 月,该公司与 Red Hat.G ...

  8. Java 将XML转为PDF

    可扩展标记语言(XML)文件是一种标准的文本文件,它使用特定的标记来描述文档的结构以及其他特性.通过将XML转换为PDF,能够便于文件传输及共享.本文,将介绍通过Java代码来实现该格式转换的方法. ...

  9. 有关base64的作业

    1.有关Base64的介绍:Base64这个术语最初是在"MIME内容传输编码规范"中提出的.Base64不是一种加密算法,虽然编码后的字符串看起来有点加密的赶脚.它实际上是一种& ...

  10. 基于FastAPI和Docker的机器学习模型部署快速上手

    针对前文所述 机器学习模型部署摘要 中docker+fastapi部署机器学习的一个完整示例 outline fastapi简单示例 基于文件内容检测的机器学习&fastapi 在docker ...