vue.js
QSWQSWQSWQSWQSW
.
展开
-
webpack搭建环境启动vue框架
第一步:npm init webpack 文件名称第二步:cd 进入文件夹第三步:npm install 安装node_modules包第四步:npm run dev 启动vue项目原创 2019-03-29 15:47:09 · 115 阅读 · 0 评论 -
vue购物车数量+-组件
<template> <div class="number"> <div class="jian" @click="minus">-</div> <div class="num">{{number}}</div> <div原创 2019-01-17 09:49:30 · 1146 阅读 · 0 评论 -
淘宝flex引入
用HBuild编辑器第一步:引入淘宝flex的js文件如果是在vue中使用,那么就找到src下的index.html页面,将它引入到这个页面就行了。 <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>第二步:设置编辑器px自动...原创 2018-12-26 13:11:08 · 601 阅读 · 0 评论 -
vue密码框内容显示隐藏
实现密码框内容显示隐藏效果<template> <div class="mylogin"> <div class="head"> <img src="../../assets/back.png" @click="back()"/> <span>会员登录&a原创 2018-12-28 14:30:23 · 4663 阅读 · 5 评论 -
vue星级评选
将星级评选封装成一个新的组件,然后在其他组件中引入这个封装好的星级组件————import…from…和components(局部注册)最后写上这个标签就引入完成了:关于里面的temp…-----这是在一个v-for遍历出来的数组中循环得到的一个属性,到时候你看看你获取到的数据中这个星级的分数是多少。。&lt;template&gt; &lt;div&gt; &lt;div i...原创 2018-12-06 20:05:18 · 156 阅读 · 0 评论 -
vue引入animate.css及样式大全
fade: { title: '淡入淡出', fadeIn: '淡入', fadeInDown: '向下淡入', fadeInDownBig: '向下快速淡入', fadeInLeft: '向右淡入', fadeInLeftBig: '向右快速淡入', fadeInRight: '向左淡...原创 2018-12-12 19:46:12 · 4535 阅读 · 0 评论 -
vue 仿QQ左滑删除组件功能
参考此地址https://www.jb51.net/article/136221.htm转载 2018-12-07 20:10:44 · 664 阅读 · 0 评论 -
用vue将数字转为中文大写金额
记得引入vue.js文件 <html lang="en"><head> <meta charset="UTF-8"> <title>用vue将数字转为中文大写金额</title> <script src='vue.js'></script><原创 2018-11-01 13:13:17 · 9962 阅读 · 0 评论 -
vue中如何引用echarts
1、首先百度搜索echarts进入官网2、点击上面导航条中文档里的教程3、在左边目录中找到第三个 “在 webpack 中使用 ECharts”4、首先在小黑窗中用npm安装echarts插件5、将下面这一段代码复制到要实现效果的那个页面(组件)中(注:此代码外要用methods包住):// 基于准备好的dom,初始化echarts实例var myChart = echarts.ini...原创 2018-10-24 19:25:09 · 1079 阅读 · 0 评论 -
vue做图片懒加载的步骤
1、在windows的cmd里输入npm install vue-lazyload --save2、复制下面代码到 main.js中 (注①:将有注释删掉的那句删掉)(注②:粗体的那一句话、loading代表加载中的意思,所以将后面的路径换成你想要加载时显示的gif图片在线地址即可) import VueLazyload from 'vue-lazyload' Vue.u...原创 2018-10-21 20:51:24 · 320 阅读 · 0 评论 -
linkActiveClass
linkActiveClass是做路由跳转点击时的样式的。1、首先要在有router-link标签的组件中的style里写一个class样式,比如:.active{ background:res;}2、接下来打开router文件夹下面的index.js,在routes:[]外面写一行调用一下刚刚写的class属性就可以了:linkActiveClass:'active'...原创 2018-10-25 20:44:44 · 698 阅读 · 0 评论 -
vue中webpack打包
1、打开文件夹,找到config文件夹中的index.js后进入2、找到build方法中的画红线的那一句,在 / 前面加一个 .3、然后在小黑窗中执行 npm run build 这样就算打包完成了4、最后看你的文件夹中多出来了一个 dist 文件夹 ,打开后在这里面直接打开index.html 这样你的项目就直接运行出来了。(注:写的json数据都要放到static文件夹中,不然...原创 2018-10-25 20:37:29 · 178 阅读 · 0 评论 -
用vue-awsome-swiper做vue的轮播步骤
1、首先进入百度打开vue-awsome-swiper-npm2、在小黑窗中敲 npm install vue-awesome-swiper --save3、将以下代码引入到文件夹中的main.js中import VueAwesomeSwiper from 'vue-awesome-swiper'// require stylesimport 'swiper/dist/css/swipe...原创 2018-10-22 19:56:30 · 647 阅读 · 1 评论 -
vue.js用v-bind渲染图片
这里需要注意的是一定要引入vue.js文件。如果没有的话 , 可以去vue官网上下载vue.js文件。原创 2018-09-28 20:08:03 · 1096 阅读 · 0 评论 -
vue.js生命周期钩子函数
vue.js生命周期的八大状态:1. beforeCreate(创建前)2. created(创建后)3. beforeMount(载入前)4. mounted(载入后)5. beforeUpdate(更新前)6. updated(更新后)7. beforeDestroy(销毁前)8. destroyed(销毁后)...原创 2018-09-28 19:56:50 · 230 阅读 · 0 评论