以下是为您整理出来关于【vue学习】合集内容，如果觉得还不错，请帮忙转发推荐。
vue扩展插件(1) vue-cli 脚手架(2) vue-resource(axios) : ajax请求(3) vue-router 路由(4) vuex 状态管理(5) vue-lazyload 图片懒加载(6) vue-scroller 页面光滑动相关(7) mint-ui : 基于vue的ui组件库(移动端)(8) element-ui : 基于vue的ui组件库(pc端) <div id="test"><input type="text" v-model="msg"><p>Hello {{msg}}</p> </div> <script type="text/javascript" src="../lib/vue.min.js"></script> <script>var v = new V...
在家的闲暇时间来完善自己的前端知识。经过两三天的学习，按照webpack文档学习，vue文档学习，最后实现了两者结合的目标。webpack按照网站上guide的流程依次学习1、使用npm安装webpack2、设置输入文件，比如怎样引入css，images，fonts，data3、设置输出文件，比如可以根据自己的设置来决定输出脚本的名称，生成新的页面，在每次生成新页面之前先把旧的页面进行清理4、开发过程中，使用source maps来显示提示信息，方便开发者定位错...
一.前端开发工具包node.jsNode.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。 Node.js 的包管理器 npm，是全球最大的开源库生态系统。官网：https://nodejs.org/en/下载最新版本安装，疯狂点击下一步，就可以了！安装完成后，打开cmd控制台，输入命令node -v 查看版本：C:\Users\john>node -v v10.7.0本质上还是JS，跑在V8引擎上的，让JS能够和操作系...
1、插槽（1）插槽内容像 HTML 元素一样，我们常常需要给组件传递内容比如在下面的例子中，我们给自定义组件 prompt-info 传入 出错啦 的文本<!DOCTYPE html> <html><head><title>Demo</title><script src="https://cdn.jsdelivr.net/npm/vue"></script> </head><body><div id="app"><prompt-info>出错啦</prompt-info></div><script>Vue.component('prompt-info', {template: `<div><h3>提示信息</h3></div>`})new Vue({el: '#app'...
<!DOCTYPE html> <html> <head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>vue</title><link rel="stylesheet" href=""><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><!-- <script type="text/javascript" src="../js/vue.js"></script> --></head> <body><div ><input type="text" v-model="n1">+<input type="text" v-model="n2">=<input type="text" v-mode...
Vue学习 数据绑定 {{ msg }} 双向 {{* msg }} 只绑定一次 {{{ htmlInfo }}} 表示htmlinfo里 有html标签 ，里面的{{}}将不可用 Vue.partial(‘my-partial‘, ‘<p>This is a partial! {{msg}}</p>‘) 可以动态html并包含{{}} {{number+1}} {{ok?‘yes‘:‘no‘}} {{message.split(‘‘).reverse().join(‘‘)}} 支持js表达式，不支持语句，if,支持三元 {{ message | filterA | fi...
网上有些贴子少了至关重要的一步导致我一直没装上， 切记！！install后还需build，且install和build都在vue-devtools文件夹内执行github下载地址 点击跳转 具体步骤：第一步：找到vue-devtools的github项目，并将其clone到本地 vue-devtoolsgit clone https://github.com/vuejs/vue-devtools.git 第二步：安装项目所需要的npm包（进入vue-devtools编译项目文件目录，很重要！！）建议使用npm淘宝镜像按照依赖包。地址：http://np...
vue过渡使用transition的封装组件，有4个（css）类名在 enter/leave的过渡状态中切换1，v-enter:定义进入过渡的开始状态，在元素被插入时生效，在下一帧时移除2，v-enter-active定义进入过渡的结束状态，在元素被插入时生效，在 transition/animation完成之后移除。3，v-leave定义离开过渡的开始状态，在离开过渡被触发时生效，在下一帧移除。4，v-leave-active定义离开过渡的结束状态，在离开过渡被触发时生效，在transition/ani...
vue.js学习vue 不支持ie8及以下的浏览器因为vue采用了ECMAScript 5的特性。安装vue采用js引入的方式使用vue <script src="https://cdn.jsdelivr.net/npm/vue"></script> 安装vue-clinpm install vue 初始化一个vue项目可以使用webstom初始化项目，也可以通过官方给与的vue-cli来创建vue init webpack 项目名 上面这种方式是通过官方的vue-cli创建，创建中会出现一些推荐的依赖包用于安装。esLine 是一种代码检查方式，在练习的时候...
//html <div id="app"><input type="button" value="ok" v-bind:title="msg" v-on:click="show" /> <input type="button" value="OK" :title="msg" @click="show" />//对应的v-bind和v-on的简写</div> //script <script>var vm =new Vue({el:‘app‘,data:{msg:‘点击一下‘}, methods:{//methods中定义了当前vue实例中所有可用的方法show:function(){ alert(‘hello‘) } }}) </scrip...