vue开发chrome扩展,数据通过storage对象获取
开发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对象获取的更多相关文章
- 手把手教你开发Chrome扩展三:关于本地存储数据
手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 HTML5 ...
- 开发 chrome 扩展 GitHub-Remarks 的一些想法以及遗憾
前文 对于单页应用中如何监听 URL 变化的思考 说到我在开发 chrome 扩展 GitHub Remarks 中遇到的一个问题,本文来聊聊开发这个扩展的前后心路历程. 为什么开发这个扩展?前文说到 ...
- 手把手教你开发chrome扩展
转载:http://www.cnblogs.com/walkingp/archive/2011/04/04/2003875.html 手把手教你开发chrome扩展一:开发Chrome Extenst ...
- 手把手教你开发Chrome扩展二:为html添加行为
手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 上一节我们 ...
- 手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单
手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩 ...
- AutoCAD.NET二次开发:扩展数据之XData
结果缓存——ResultBuffer 结果缓存即 Autodesk.AutoCAD.DatabaseServices.ResultBuffer 类型,使用 ResultBuffer 对象时需要提供一个 ...
- VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- 使用 Create-React-App 开发 Chrome 扩展
整理 Kindle 标注.书签和笔记从未如此简单! Kindle 标注管理应用 Kindle Mate 只支持 Windows,不支持 Mac.标注只是解析我的剪贴文本文件,配合 FileReader ...
- vue开发 - 将方法绑定到window对象,给app端调用
通过jsBridge方法,H5可以调用客户端(ios,android)的内部方法,同样,客户端也需要能调用H5页面里定义的js方法,但是在vue里,所有的方法都是在组件内部声明的,也只能在组件内部调用 ...
随机推荐
- 浅谈:redis的主从复制 + 哨兵模式
浅谈:redis的主从复制 + 哨兵模式 主从模式 在谈论redis的主从复制之前,我们先回想下mysql的主从搭建过程,第一步呢首先要在主库服务器中修改my.cnf,开启一下bin_log功能, ...
- 2022李宏毅作业hw1—新冠阳性人员数量预测。
事前 : kaggle地址:ML2021Spring-hw1 | Kaggle 我的git地址: https://github.com/xiaolilaoli/lihongyi2022homew ...
- Install VMware Tools in CentOS 7 command line mode
1.首先启动CentOS 7,在VMware中点击上方"VM",点击"Install VMware Tools..."(如已安装则显示"Reinsta ...
- 【C# 线程】RPC中常见的Stub| marshalling怎么理解
RPC服务的基本架构图如上,可以很清楚地看到,一个完整的RPC架构里面包含了四个核心的组件,分别是Client ,Server,Client Stub以及Server Stub,这个Stub大家可以理 ...
- Weblogic 打补丁冲突检测慢---解决方法
转至:https://www.cnblogs.com/vzhangxk/p/13365457.html 1.Smart Update 智能升级工具版本: [root@pxc1 bsu]# ./bsu. ...
- JavaSE高级编程之多线程
4. 多线程 4.1 基本概念:程序.进程和线程 程序.进程和线程 程序:为了完成特定的任务,用某种语言编写的一组指令的集合.程序是一段静态的代码,静态对象. 进程:是程序的一次执行过程或正在运行的程 ...
- 积分图(三) - Boxfilter 的实现过程分析
Boxfilter 快速计算 它可以使复杂度为O(MN)的求和,求方差等运算降低到O(1)或近似于O(1)的复杂度,它的缺点是不支持多尺度. Boxfilter 的原理有点类似 Integral Im ...
- c++11 实现枚举值到枚举名的转换
效果 ``` ENUM_DEFINE ( Color, Red, Blue, ) EnumHelper(Color::Red) -> "Red" EnumHelper(Col ...
- docker学习笔记(2)- 仓库
Docker仓库是镜像存储.分发.部署的关键,制作好应用程序镜像后上传到仓库,使用Docker daemon从仓库拉取后运行,我们可以使用官方共有仓库docker hub或者搭建私有仓库 Docker ...
- 借助DBHelper实现学生管理案例分析
一.案例功能的实现 数据: --专业 create table ProfessionInfo ( ProfessionID int primary key identity(1,1), --专业编号 ...