router.js

导入路由模块 vue-router
import VueRouter form 'vue-router'

导入组件
import index form './components/inde.vue'

让vue使用vue-router当做自己的路由
Vue.use(VueRouter)

创建一个路由对象并输出
export default newVueRouter({
    router:[
        {path: '/index', component: index}
    ]

})

app.js

导入一个根组件
import foo form './src/router.vue'

导入一个路由文件
import router form './src/router.js'

给根组件设置一个id
foo.el = '#root'

给根组件设置路由
foo.router = router

创建一个vue对象
export default new Vue(foo)

指定一个路由入口
router.push('index')

router.vue

js: this.$router.push(e); //更新指定路由入口

环境搭建：

1. 安装Node.js

2. 安装weex: npm install -g weex-toolkit

创建和执行项目：

weex create porject //weex init porject不适用了

npm install

npm run dev

npm run serve

1.weex的优势：

①支持ES6规范，

②性能优异，开发简洁标准，体积小巧

③跨平台

2,.weex的调试工具

①weex playground

②下载地址：https://weex.apache.org/zh/guide/playground.html

③使用方法：在手机中下载weex playground APP,用weex playground APP扫描网页项目中的二维码。

npm node.js的管理包工具

weex 一套跨平台移动开发工具

weex - HBuilder

webview示例

webview模块

Web组件示例

Web组件

<a href="../dist/app.weex.js">

    <text>jump</text>

</a>

<a>组件：

1. Weex中a组件定义了指向weex页面打包后的一个js地址；

2. 组件中无法添加文本，需要加上text组件才行；

3. 此组件支持除了自己以外的所有weex组件为子组件；

4. 支持所有通用样式；

5. 不要给<a>组件添加click事件；

6. 不能添加html页面链接；

定位：

1. weex支持position

2. weex不支持z-index层级关系，但靠后元素层级更高

3. 若定位元素超过容器编辑，Android下超出部分将不可见，因为Android端元素overflow默认值为hidden
   

屏幕适配系数：scale

1. weex设计尺寸是750px，认为所有屏幕宽度都是归一化的750px，若不符，则会根据实际宽度去映射，scale=当前屏幕尺寸/750。当传入一个尺寸值a时，则实际尺寸为value=a * this.data.scale;

2. weex长度值只支持像素值，不支持相对单位（em， rem）；

3. 设定边框border不支持组合写法border：1px solid #ff0000

4. 背景色不支持background:red写法，需改为具体的background-color：red

环境搭建：

1. 安装Node.js

2. 安装weex: npm install -g weex-toolkit

创建和执行项目：

weex create porject //weex init porject不适用了

npm install

npm run dev

npm run serve