开发chrome插件时遇到一个问题,那就是单文件组件的data数据需要从chrome提供的storage对象中获取,但是 chrome.storage.sync.get 方法是异步获取数据的,需要通过它的回调函数进行使用获取到的数据,没有返回值

解决方案就是 通过Function.bind(context)方法进行绑定上下文信息,这样就可以正常的在回调函数中进行设置到 vue 单文件组件的数据里面了

beforeMount:function(){
chrome.storage.sync.get("key",function(items){
console.log(this)
}.bind(this))
}

当然,我是通过 vue的声明周期 挂载之前,创建之后的阶段中进行调用获取步骤的

vue开发chrome扩展,数据通过storage对象获取的更多相关文章

  1. 手把手教你开发Chrome扩展三:关于本地存储数据

    手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 HTML5 ...

  2. 开发 chrome 扩展 GitHub-Remarks 的一些想法以及遗憾

    前文 对于单页应用中如何监听 URL 变化的思考 说到我在开发 chrome 扩展 GitHub Remarks 中遇到的一个问题,本文来聊聊开发这个扩展的前后心路历程. 为什么开发这个扩展?前文说到 ...

  3. 手把手教你开发chrome扩展

    转载:http://www.cnblogs.com/walkingp/archive/2011/04/04/2003875.html 手把手教你开发chrome扩展一:开发Chrome Extenst ...

  4. 手把手教你开发Chrome扩展二:为html添加行为

    手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 上一节我们 ...

  5. 手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单

    手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单   手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩 ...

  6. AutoCAD.NET二次开发:扩展数据之XData

    结果缓存——ResultBuffer 结果缓存即 Autodesk.AutoCAD.DatabaseServices.ResultBuffer 类型,使用 ResultBuffer 对象时需要提供一个 ...

  7. VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js

    VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...

  8. 使用 Create-React-App 开发 Chrome 扩展

    整理 Kindle 标注.书签和笔记从未如此简单! Kindle 标注管理应用 Kindle Mate 只支持 Windows,不支持 Mac.标注只是解析我的剪贴文本文件,配合 FileReader ...

  9. vue开发 - 将方法绑定到window对象,给app端调用

    通过jsBridge方法,H5可以调用客户端(ios,android)的内部方法,同样,客户端也需要能调用H5页面里定义的js方法,但是在vue里,所有的方法都是在组件内部声明的,也只能在组件内部调用 ...

随机推荐

  1. [旧][Android] 布局优化

    备注 原发表于2016.05.21,资料已过时,仅作备份,谨慎参考 前言 最近在编写布局时,发现这一块是有很多值得深入学习的地方的.毕竟应用开发,界面展示是十分重要的部分.另外在开发时,为自己的代码做 ...

  2. Linux常用文件权限命令详解

    pwd pwd命令用于获取当前工作目录的绝对路径. 使用示例: pwd 效果如下图: cd cd命令用于切换工作目录. 使用示例: cd 万猫学社/ 效果如下图: 其中在路径表示时, 一个半角句号(. ...

  3. Centos部署Loki日志聚合系统

    关于一些日志聚合由来及原理科普见我的另外一篇 <编程入门之日志聚合系统> https://www.cnblogs.com/uncleguo/p/15948763.html Loki日志聚合 ...

  4. 服务端&客户端注册进Eureka

    目录 服务端(接口提供方) 创建项目 导入Eureka客户端POM 启动类添加注解 配置YML 暴漏接口 启动服务 集群 配置成功后页面如下 客户端(接口调用方) 修改Yml文件 配置类 启动类添加注 ...

  5. linux作业--第八周

    1.创建私有CA并进行证书申请. 配置文件存放路径 /etc/pki/tls/openssl.cnf [ CA_default ] dir = /etc/pki/CA # Where everythi ...

  6. think php 框架下拉分页

    //以对象的形式获取数据库$data变量的信息,将lastPage()传输至页面 $lastpage = $data->lastPage(); $this->assign('lastpag ...

  7. Linux备份数据库,mysqldump命令实例详解

    mysqldump是mysql数据库中备份工具,用于将MYSQL服务器中的数据库以标准的sql语言的方式导出,并保存到文件中. 语法: mysqldump (选项) 选项: --add-drop-ta ...

  8. 支持向量机(SVM):用一条线分开红豆与绿豆

    算法原理 要找到一些线,这些线都可以分割红豆和绿豆,找到正确的方向或者斜率的那条线,确认马路的宽度,得到最优解--马路的中轴 超平面:在三维空间中,平面是两个点距离相同的点的轨迹.一个平面没有厚度,而 ...

  9. 『现学现忘』Docker常用命令 — 20、容器常用命令(二)

    提示:接上一篇 目录 9.后台启动容器 10.查看容器日志 11.查看容器内运行的进程 12.查看容器内部细节 9.后台启动容器 后台启动容器也叫启动守护式容器. 命令:docker run -d 镜 ...

  10. Caffe2源码解析

    写在前面 上一篇文章对Caffe2中的core模块进行了简单拆解Caffe2源码解析之core,本篇给出其它模块的拆解,目的是大致了解每个模块的内容和目标,进一步理解Caffe2的整体框架.内容不多, ...