2017年09月_milli236

原创 vue.js图片无法显示问题总结

1。data数据里的写法：js里的应该是要写成 url: require('../../assets/workbench/1.png')如：export default { name: 'hello', data () { return { msg: 'Welcome to Yrrrrrrrf对p', visible:false,

2017-09-24 02:53:22 14713 1

原创 vue.js处理时间

1.main.js ，全局过滤器。方便使用import Vue from 'vue'import App from './App'import router from './router'import store from './vuex/index.js'import Vuex from 'vuex'//引入axiosimport axios from 'axios'Vue.

2017-09-22 16:37:01 3383

转载 Vue2.0生命周期和钩子函数

每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如，实例需要配置数据观测(data observer)、编译模版、挂载实例到 DOM ，然后在数据变化时更新 DOM 。下图展示的就是一个vue实例对象的生命周期。从图上我们可以看到vue在生命周期中有这些状态，beforeCreate,created,beforeMount,mounted,befor

2017-09-22 15:58:55 2926

原创 vue.js2.0关于computed、methods、watch、created的区别

{{ss}} export default{ data(){ return{ list:'' } }, computed:{ ss:function(){ return this.list+'zhe shi s' }, }, created

2017-09-22 15:41:29 10376

原创 vue.js2.0父子组件间传参（二）实现弹窗

1. 父组件显示元素 import test from './test.vue'export default { name: 'hello', data () { return { msg: 'Welcome to Your Vue.js App', show: false } }, method

2017-09-22 13:54:07 2270

原创 vue.js2.0非父子组件之间传参

如果2个组件不是父子组件那么如何通信呢？这时可以通过eventHub来实现通信. 所谓eventHub就是创建一个事件中心，相当于中转站，可以用它来传递事件和接收事件.let Hub = new Vue(); //创建事件中心11组件1触发：div @click="eve">methods: { eve() { Hub.$emit('change','

2017-09-22 13:49:31 418

原创 vue.js2.0父子组件间传参（一）实现弹窗

一。父子传参（父向子传参，子组件不能直接修改参数，另用$emit实现子向父传参）父：父向子传：props父的 html：tishi :child="state">tishi>父的script data(){ return{ state:false }}修改state，即会影

2017-09-22 13:06:46 2332

原创 vue2.0下拉列表数据绑定

1.html {{list.name}} 2.scriptexport default{ data(){ return{ selected:'大衣', types:[ {name:'皮衣',value:'皮衣'}, {name:'大

2017-09-21 20:51:18 1599

原创 vuejs2.0关于用axios结合vuex开发

vuex：index.js, actions.js, mutations.js, getters.js1.index.js中import Vuex from 'vuex'import Vue from 'vue'import actions from './actions'import mutations from './mutations'import

2017-09-21 19:42:03 675

原创 vuejs使用axios异步访问时用get和post的方法

script中。。。 let data={....};let url=xx;方法各异：GET:l this.$ajax.get(url,{ params:data }) .then(function (res) { console.log(res.data) ...

2017-09-21 16:30:04 5084

原创 vue使用axios异步请求后端数据的使用

Vue 原本有一个官方推荐的 ajax 插件 vue-resource，但是自从 Vue 更新到 2.0 之后，官方就不再更新维护 vue-resource，并推荐axios，目前主流的 Vue 项目，都选择 axios 来完成 ajax 请求。使用方法：1.安装npm install axios --save-dev2.使用：main.js中：

2017-09-21 08:33:06 6582

原创 vuejs项目里css引用背景图片不能显示

2.解决：build->utils.js里，修改：增加publicPath:'../../',if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, publicPath:'../../', fallback: 'vue-style-loader'

2017-09-08 16:56:45 6465 1

原创 VueJs制作轮播组件

1.创建子组件，slider.vue2.引入需要轮播的页面中，html: 用:slides=""来引用不同的数据，从而可以反复使用slider.vue组件 script:(slides一致)data () { return { invTime:2000, slides:[ { src

2017-09-08 14:06:01 2704

转载 box-shadow的使用技巧总结

text-shadow是给文本添加阴影效果，box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及，这一特殊效果使用越来越普遍。基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径阴影扩

2017-09-07 21:41:36 1371

原创 vuejs搭建的项目如何引入图标字体

引入阿里的icon库；1.所选择的字体图标下载代码包，2.代码包里除掉demo文件，其他拷贝到vue项目里，自建一个icon文件目录3.所引用的组件页面导入iconfont.css文件 @import "../../../assets/icon/iconfont.css";...4页面：页面中添加一个i标签 class填入iconfont icon-xxx即可，

2017-09-06 21:15:09 15345 4

原创 css布局：水平和垂直方向都居中，以及用flex实现

position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%) !important;//或 position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50

2017-09-04 15:40:51 1117

milli236的博客