随笔分类 - vue
关于vue的记录
摘要：1.Vue作者推荐 2.功能特点： 1、在浏览器中发送XMLHttpRequests请求 2、在node.js中发送http请求 3、支持Promise API 4、拦截请求和响应 5、转换请求和响应数据 关于axios名字的由来： 王老师认为是：axios： ajax i/o system aja
阅读全文
摘要：Modules：可以定义新的模块 官方上说，当我们的应用变的非常复杂时，store对象就有可能变得相当臃肿 为了解决这个问题，Vuex允许我们将store分割成模块（Module）， 在这里，每个模块都拥有自己的state、mutations、actions、getters等 写个例子吧： 首先我们
阅读全文
摘要：Mutation同步函数： 在mutations 中 使用异步操作的话，页面上devtools工具无法跟踪信息。 所以在mutations中的方法必须是同步方法 Action的基本定义 我们强调，不要再mutation中进行异步操作，但再某些情况下，我们确实希望再vuex中使用异步操作（网络请求等）
阅读全文
摘要：state : 单一状态树（单一数据源），主要是用来存放状态的 如： count:0 Getters :类似于单个组件里面的计算属性 mutations : 状态更新的唯一方式： commit mutations 主要分为2部分： 1.字符串的事件类型 increment(state){state.
阅读全文
摘要：在vue中,不使用懒加载的情况下,我们打包后的dist中会有2个文件夹.分别用于存放css 和 js, 在js中,会生成3个js文件: *代表生成的数字字母等 1.app.******.js : 这个js存放的是我们的自己写的逻辑,业务等js代码 2.manifest.*******.js : 这个
阅读全文
摘要：第一阶段： 后端渲染阶段 当时的显示页面是在后台服务器生成之后直接返回客户端的，由于是在服务器生成的页面，所以也叫做后端渲染； 采用的是 jsp or php ，在jsp中有 html+css 和大量的Java代码，特别不容易阅读和维护。而且这就需要前端想要写jsp就必须懂得java代码。 所以当时
阅读全文
摘要：Vue内部修改数组的方法： Vue.set( 要修改的对象，索引值，修改后的值)Vue.set(this.array,0,'加油') 将数组中第一个元素修改为 加油 Vue中对数组是响应式的方法： 1.push（）：该方法是在数组最后添加数据 假设数组为array this.array.push('
阅读全文
摘要：1.变量作用域： 变量再什么范围内是可用； var 是JavaScript设计时的缺陷， var在块级里面声明，但是在块外面还可以使用，影响非常不好；也就是说 var 并没有块级作用域 举个例子：if的块级 引起的问题 var func; if(true){ var name = 'why'; fu
阅读全文
摘要：想要解决打开页面出现{{message}}， 我们需要使用 “隐身斗篷” ： v-cloak 举个例子： <div id="app"> </div> 我们通过 el：“#app" 挂载到app 这个大的div中 然后我们： <div id="app" v-cloak> //在这里加上斗篷 </div
阅读全文
摘要：关于Vue的监听:watch watch是对单个属性的监听 对于基本数据类型的监听 简单监视 对于复杂数据类型的监听 深度监视 下面的代码,有一个简单监视 和 一个深度监视 <body> <div id="app"> <input type="text" v-model='msg' /><br><b
阅读全文
摘要：这两天在学Vue,记录一下我认为比较重要的东西 Vue中的组件通信: 我们可以分为3个步骤来: 1.声明局部子组件,简称 "声子", 2.挂载到dom树上面去,简称:"挂子" 3.进行使用,简称:"用子" 上面写的别人可能看不太明白,毕竟只是我的看法: <body> <div id="app"> <
阅读全文
摘要：在Vue中,生命周期的理解与否是非常重要的(我朋友说的:) ) 然后我就去看了看了vue官网的视频,得知vue生命周期的主要作用:方便我们在程序运行的各个阶段加如我们想要加入的代码; 1.beforeCreate: 创建前状态;——————>在实例初始化之后,数据观测(data observer)
阅读全文
摘要：页面效果比较差,但是有图总比没图强点 这是最开始的页面,我们看到,图中只有一个"右箭头",点击右箭头; 左箭头也有了,然后我们继续点击右箭头; 右箭头没有了,只剩下了左箭头, 以上就全部的效果图了; 分析一下,如何做到这个功能: 1.先不要去考虑样式(虽然确实丑,但景色还是不错的对吧),我们一般都是
阅读全文
摘要：在vue中 通过点击事件实现显示与隐藏是非常简单的. 首先我们先整带颜色的一个小方块(div) 如图: 我们要实现一个点击按钮隐藏或者显示该方块的功能; 首先我们先写一个div: div id="app"> <input type="button" value="切换"> <div style="b
阅读全文
摘要：首先.我们先导入vue插件: <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 然后建立一个<div> <div id="app"> <button>-</button> <span></span> <butto
阅读全文
摘要：1.Object.freeze()，会阻止修改现有的属性，也意味着响应系统无法再追踪变化。 例子： <body> <div id="app"> <p class="hang hangbiaoqian">{{foo}}</p> <button @click="foo='baz'"> 按钮</butto
阅读全文
摘要：在vue中 永远不要把 v-if 和 v-for 同时用在同一个元素上。 最好是加上key，以达到准确的目的 我们可以将v-if 放到容器元素里 例如ol ul 中去 li 里面放v-for 如下： <ul v-if="shouldShowUsers"> <li v-for="user in use
阅读全文
摘要：Vue.component('buttons',{ data: function(){ return{ count:0 } }, template:'<h1 @click="count+=99" style="font-size: 12em;color: red;">我对你的爱只有上限，没有下限！！
阅读全文
摘要：<body> <div id="app"> <buttons></buttons> //buttons 标签组件，是我们自定义的标签组件 </div> </body> 创建自定义组件 buttons Vue.component('buttons',{ data: function(){ return
阅读全文
摘要：<div id="app"> <p>{{hello}}</p> <button @click="click">反转信息</button> </div> <p>标签内写内容(反转内容)； <button>按钮，写一个点击事件 <script> new Vue({ el:"#app", data:{ h
阅读全文
浙公网安备 33010602011771号