weixin_46995731的博客

vue中ref的用法

在vue项目中使用Vue2Leaflet地图组件最近遇到一个项目,使用的是Vue2Leaflet地图插件,咱们简单地介绍一下怎么使用吧.详细内容可以看官方文档.1.安装插件由于项目中会使用到vue2-leaflet和leaflet，因此需要安装2个插件npm install vue2-leaflet --savenpm install leaflet --save2、添加LMap 组件<l-map style="width: 100%; height: 600px;" :zoom="z

vue项目中使用高德地图JS API进行精确定位并获取定位信息注册账号并申请Key首先，注册开发者账号，成为高德开放平台开发者登陆之后，在进入「应用管理」 页面「创建新应用」为应用添加 Key，「服务平台」一项请选择「 Web 端 ( JSAPI ) 」这一步不是很难,应该很快就搞定了.应用1. 在页面添加 JS API 的入口脚本标签，并将其中「您申请的key值」替换为您刚刚申请的 key；因为咱们是vue项目所以直接在index.html中引用就行<scrip

Vue .sync修饰符与$emit(update:xxx).sync修饰符的作用在对一个 prop 进行“双向绑定,单向修改”的场景下，因为子组件不能直接修改父组件，sync在2.3版本引入，作为一个事件绑定语法糖，利用EventBus，当子组件触发事件时，父组件会响应事件并实现数据更新，避免了子组件直接修改父组件传过来的内容。.sync修饰符之前的写法父组件：<parent :myMessage=“bar” @update:myMessage=“func”>js定义函数:fu

vue项目中scss样式的语法总结相信在写vue项目的时候,每个前端都有自已习惯的样式语法,比如css,stylus,scss等.在这里我给大家总结一下scss的语法.为什么用scss呢?Sass是成熟、稳定、强大的CSS预处理器，而SCSS是Sass3版本当中引入的新语法特性，完全兼容CSS3的同时继承了Sass强大的动态功能。那么，它到底有哪些特性呢，我们来看一下:安装安装sass 依赖包 ，在cmd界面输入：npm install sass-loader --save-devnp

vue中img标签的src属性的使用初步接触vue框架时,好多朋友使用img标签时,设置动态src属性时,可能都会遇到路径不生效的问题,咱们废话不多说,开整!!!img标签引用资源图片一般不需要webpack处理的资源放在static,需要经过处理的放在assets1.不需要webpack处理的图片放在static不需要webpack处理的图片,直接使用绝对路径调用图片,如"/static/xx/xxx.png"栗子html代码<img v-bind:src="imgUrl"/>

keep-alive以及activated,deactivated生命周期的用法这是在网上看到的一篇文章vue官网的描述： 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 相似， 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。当组件在 内被切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。使用例子说明起来更好理解:先定义两个组件组件a内容:组件b内容:父组件内容:界面如下：我们点击按钮a

vue项目中配置环境变量此篇文章是在网上看到的,项目中我采用的是第二种方式,此文章出处.1.环境背景项目环境一般分为开发环境，测试环境，线上环境因为每个环境的接口域名、webpack 配置都是不同的，所以在打包构建时，我们需要区分这些环境，这时就用到了环境变量在工作中使用到了两种方法来区分，下面将这两种方式一一列举出来技术框架是vue-cli@2.x首先看下下面的解释，后面会用到< process 对象是一个全局变量，提供 Node.js 进程的有关信息以及控制进程。 因为是全局变量，

VueCLi3.0及以上版本搭建过程

Vue项目中使用vw实现移动端适配随着viewport单位越来越受到众多浏览器的支持，下面将简单介绍怎么实现vw的兼容问题，用vw代替rem。1.准备工作我是用vue-cli脚手架搭建vue项目的，怎样搭建就不赘述了，当我们采用vue-cli脚手架搭建完项目，安装所有依赖包之后，用npm run dev启动后，在根目录有一个 .postcssrc.js 文件，文件结构如下：vue-cli默认已经安装以上三个插件：postcss-import：相关配置可以点击这里。主要功有是解决@import引入