- 博客(32)
- 收藏
- 关注
RSS订阅原创 flex布局
display： flexflex-direaction： columnjustify-content：center弹性布局才能用justify-contentlex-start 默认值。项目位于容器的开头。 测试 »flex-end 项目位于容器的结尾。 测试 »center 项目位于容器的中心。 测试 »space-between 项目位于各行之间留有空白的容器内。 测试 »...
2019-02-27 17:05:37
79
原创 webpack-dev-server配置
Vue-cli2config/index.js只要在dev环境下请求/api,就会被转发到http://localhost:8080/static/mockmodule.export { dev: { proxyTable: { '/api': { target: 'http://localhost:808...
2019-02-27 12:32:21
133
原创 VSCode 同步设置及扩展插件 实现设备上设置统一
准备工作：电脑上需安装VSCode，拥有一个github账户。实现同步的功能主要依赖于VSCode插件 “Settings Sync”Setting Sync 可同步包含的所有扩展和完整的用户文件夹设置文件快捷键设置文件Launch FileSnippets FolderVSCode 扩展设置工作空间Setting Sync 快捷键：上传： Shi...
2019-02-27 10:46:28
288
原创 fastclick安装使用
$ npm install fastclick --saveimport fastClick from 'fastclick'fastClick.attach(document.body)
2019-02-26 14:38:57
1983
原创 移动端meta头
最大,最小可缩放比例,用户是否允许缩放 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
2019-02-26 14:36:32
169
原创 stylus安装
$ npm install stylus --save-dev$ npm install stylus-loader --save-dev
2019-02-26 14:32:02
512
原创 stylus的函数,变量,引用
创建文件mixnis.stylellipsis() overflow: hidden white-space: nowrap text-overflow: ellipsisvariables 变量建一个variables.styl$bgColor = #00bcd4$darkTextColor = #333$headerHeight = .86rem在Vue中引用cs...
2019-02-26 14:30:47
1352
原创 js一维数组转二维数组
var arr = [0,1,2,3,4,5,6,7,8,9,10];var NewArray = [];arr.forEach(item, index){ var page = Math.floor(index/8); if(!NewArray[page]){ NewArray[page] = []; } NewArray[page].push(item);}c...
2019-02-26 14:24:34
589
原创 div内容宽度超出边界后怎样设置为左右滑动，而且不显示滚动条？
div内容宽度超出边界后怎样设置为左右滑动，而且不显示滚动条？纯手写 滚动条隐藏掉就行了CSS: *{ margin:0px;padding:0px; } .wrap{ overflow: hidden; height: 40px; } .cont{ height: 60px; ...
2019-02-26 14:08:52
12713
原创 Git如何撤销merge操作
第一步查看git 的版本信息，找到merge前最近提交的版本号，并且复制对应的版本号git log第二步git reset 版本号现在暂存区，与版本库已经撤销回之前的版本了第三步查看工作区与暂存区的区别，当前工作区还是merge后的代码git status第四步撤回暂存区到工作区git checkout -- fileNameok了，现在工作区与暂存区，版本库全是m...
2019-02-26 10:27:29
4514
原创 keyframes
定义动画@keyframes animatename {0% {}50% {}100% {}}执行动画animation: keyframesName time reverse(“反转”);设置动画执行的圆点transfrom-origin:left center使用animate.css1,引入animate.css文件2,在标签上自定义class enter-ac...
2019-02-25 11:07:36
696
原创 1像素边框解决方案
@charset “utf-8”;.border,.border-top,.border-right,.border-bottom,.border-left,.border-topbottom,.border-rightleft,.border-topleft,.border-rightbottom,.border-topright,.border-bottomleft {...
2019-02-25 10:30:35
1038
原创 Vue中使用animate.css
Vue中使用keyframesv-enter v-enter-to v-enter-active自定义class名Vue中使用animate.css1,引入animate.css2,在enter-active-class上加animated 然后加其他的动画效果名
2019-02-25 10:29:13
177
原创 Vue中动画transition
Vue中使用动画要在组件外包裹一层标签如果transition上有name的话,动画的class要以fade-开头,没有name则会以v为前缀在执行动画前,会给组件添加v-enter或者v-leave 与v-enter-active/v-leave-active执行动画中会添加v-enter-to/v-leave-to...
2019-02-25 09:59:43
155
原创 Vue slot插槽
slot插槽 只有一个在父组件中的写入的dom,会被解析成插槽,在子组件的tempalte中可以使用默认值标签来代替父组件中的Dom template:""具名插槽,有多个 template:""...
2019-02-24 14:20:44
256
原创 Vue的总线机制
非父子组件传值1,vux2,发布订阅模式在Vue中称为总线机制,使用Bus实现,又称为观察者模式Vue.prototype.bus=newVue()在Vue的原型对象上绑定一个Bus属性，这个属性的值是一个Vue实例,这个实例上有bus = new Vue()在Vue的原型对象上绑定一个Bus属性，这个属性的值是一个Vue实例,这个实例上有bus=newVue()在Vue的原型对象上绑定...
2019-02-24 13:54:19
617
原创 组件绑定事件与源生事件
在组件上绑定的事件,分为两种,一种是监听事件,只能由组件内通过$emit()触发,另一种,是原生事件,触发在父元素中的方法想在组件上触发原生事件需要在事件后加.native<div id="app"> <item @click="handleClick"><item> <item @click.native="handleCli...
2019-02-24 12:44:42
250
原创 vue ios9下for in Object遍历问题
data() { return {list: [2]}}for (let i in this.list) { console.log("let in this.list = " +i)}// 这里的log将会打印两次。let list=[2]for (let i in list) { console.log("let in local list...
2019-02-23 17:17:56
469
原创 koala 考拉编译scss不支持中文（包括中文注释），解决方案如下
进入Koala安装目录，例如：C:\Program Files (x86)\Koala\rubygems\gems\sass-3.4.9\lib\sass找到engine.rb文件，在该文件中找到最后一个require元素，在该元素之后添加以下代码即可。Encoding.default_external = Encoding.find('utf-8') ...
2019-02-23 16:00:00
460
原创 koala考拉软件的安装和使用 sass/scss的编译工具koala
下载链接:https://pan.baidu.com/s/1XPu3HLK25Ht6eHXdA_HKOw 提取码: 4ty4第一步，先安装后并运行这个koala软件。选择设置，更改语言为简体中文，记得关闭软件重启字体更改才会生效。第二步,拖拽要编译的文件到koala第三步,编译...
2019-02-23 15:55:21
3592
原创 Vue中v-for与for in的区别js
在Vue中v-for ="(value, index) in list"在for(let index,item in list){}为了避免顺序混淆建议大家在Vue模板中使用v-for = “(value,index) of list”
2019-02-23 14:34:59
13398
3
原创 Vue中set的使用,Vue中set与$set的区别
Vue.set(data,key,value);data可以是Array or Object在Vue中直接操作数组的下标,会改变数组,但是不会更新页面真实DOM,例如&amp;lt;div id=&quot;app&quot;&amp;gt; &amp;lt;div v-for=&quot;(item, index) of list&quot;&amp;gt;
2019-02-23 13:59:28
8614
2
原创 Vue的组件中data必须是函数,其返回值是一个对象
Vue.component({ template:"&lt;div&gt;全局组件&lt;/div&gt;", data:function(){ return { name:"css3html5", date:"20190223" } }})es6函数简写为Vue.compon
2019-02-23 13:19:44
2873
原创 vue中数据改变页面不变
vue中，数组改变有7种变异方法,pop,push,shift,unshift,sort,splice,reverse除此之外还有改变整个引用，用下超改变数据，数据会变但是页面不变。vue中的对象，直接在对象上添加新属性，页面值不变，修改已有属性，页面会改变。可以用改变引用的形式，添加新属性...
2019-02-23 13:09:30
4822
原创 vue中v-if与v-show的区别
v-if后面可以跟v-else，v-showdisplay:none;vue的diff算法，会尽量减少dom的更改，尽量复用dom，要给v-if里的dom加key值
2019-02-23 13:07:50
256
原创 vue样式动态绑定
v-on 简写：:class string [] 数组中可以是变量也可以是string 会将数组中的",“去除后渲染在dom object {} 将 key 作为class 渲染在dom上:attr string [] 不会去除”," {} 显示 objectstyle string obj [obj , obj]...
2019-02-22 16:49:14
629
原创 vue模板中数据的动态绑定
<div id="#app> <div :attr1="a" >.</div> <div :attr1="b" >.</div> <div :attr1="[a,b]" >.</div> <div&
2019-02-22 11:44:26
762
原创 Vue中样式的绑定class与style
first wayclass的对象绑定&lt;div id="app"&gt; &lt;div :class="{colorred:isred}" &gt;message&lt;/div&gt;&lt;/div&gt;data:{ isred:true}Dom messageS
2019-02-22 11:10:02
161
原创 computed的set与get
// computed是一个对象,不是一个函数computed:{ fullName () { return this.firstName + this.lastName; }}使用get 与 setcomputed:{ fullName:{ // 这里是一个对象object get () { // 每次调用fullName的时候执行 con...
2019-02-22 10:42:04
285
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人