Vue饿了么app｜undefined

Vue.js框架

Vue.js介绍
Vue-cli脚手架搭建基本代码框架
vue-router官方插件管理路由
vue-resource AJAX通信
webpack 构建工具
es6 + eslint –>代码风格检查工具

公司漂亮夜景

工程化组件化模块化
移动端开发技巧（布局交互）

Vue

轻量级Mvvm框架
数据驱动 + 组件化开发

Vue-cli

目录结构
本地调试
代码部署
热加载
单元测试

安装

npm install -g vue-cli  //安装脚手架

vue init webpack sell  ///注意 vue init 初始化

cd sell

npm install

npm run dev

better-scroll
1.布局

2.在需要滚动的div上面添加

1 2	ref="menuwrapper" ref="foodwrapper"

3.添加方法

_initScroll () {
      this.meunScroll = new BScroll(this.$refs.menuwrapper, {
        click: true
      })
      this.foodScroll = new BScroll(this.$refs.foodwrapper, {
        click: true
      })
    }

4.使用方法

// dom结构加载结束
        this.$nextTick(() => {
          setTimeout(() => {
            this._initScroll()
          }, 100)
        })

定时器存在的意义：等待dom完全执行完毕以后初始化滚动插件

5.vue computed属性
table-cell布局

1
2
3

display：table
display:table-cell
vertical-align: middle

6.父子兄弟组件之间通信

安装 npm install stylus stylus-loader
npm install vue-resource

打包失败
cd dist
npm install -g http-server // 该命令只需执行一次, 安装过之后, 以后就不需要重复安装了.
hs

路由定向
routes: [
{
path: ‘/‘,
redirect: ‘/goods’
},

子组件派发事件到父组件

1	this.$emit('select', num); /

父组件

@select="selectRating"
selectRating(type) {  // 触发接收到子组件的派发事件
        this.selectType = type;
        this.$nextTick(() => {
          this.scroll.refresh();
        });
      }

(饿了么部署到GitHub)[https://createwj.github.io/VUE2.0-/sell/dist/]

Vue.js框架

公司漂亮夜景

Vue
Vue-cli