【VUE】基础记录1

总结VUE 使用的常识 ：
1. 路由的配置
以下部分为router.js

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)

export default new Router({

routes: [
//有几个页面，就配置几个页面的地址
    {
        path: '/',
        name: 'home',
        component: () => import(/* webpackChunkName: "common-home" */    '@/pages/common/Home.vue')
    },
     {
        path: '/List',
        name: 'List',
        component: () => import(/* webpackChunkName: "paymentService" '@/pages/XX/query/XX/list.vue')
    },
    ]
}）；

2.配置页面路由
demo.vue

	<template>
   	<div class="body">
        <ul class="cm" v-for="(item,index) of data" :key="index">
            <li>
                <label >编号：</label>
                <span>{{item.orderNo}}</span>
            </li>
         </ul>
      </div>
	</template>

    <script>
		export default {
			name: "detail",
			data() {
	  			return { 
 		 			//设置初始化值的
      				data:[],
  				}
			},
			created(){ //先执行
			  **//在模板渲染成html或者编译进路由前调用哦** 
			},
			mounted(){//后于created的执行
  			 **//已经完成了模板的渲染或者el对应的html选然后调用**
			},
			methods:{
				//页面的一些事件方法
 				 toBack(){
        			this.$router.push("上一个页面的name")；//页面的跳转
        		},
        		  //判断结果是否为空 为空用"--"代替
        		formatEmptyString(obj){
            		if (obj==""||obj==null||obj==" "){
                		return obj="--"
            		}
            		return obj
       			 },
    		},
		}
</script> 
<style lang="less" scoped>
   .show-list{
       display:block;
   }
</style>