vue使用常用方法和集成element-ui

 emement-ui
        -下载:npm install element-ui
        -使用:在main.js中配置
            import ElementUI from 'element-ui';
            import 'element-ui/lib/theme-chalk/index.css';
            Vue.use(ElementUI);
 vue绑定图片:
        <el-carousel-item v-for="img in imgs">
          <img :src="img">
        </el-carousel-item>
   vue页面挂载时,执行方法:
        mounted:function () {
            //init()为methods中定义的方法
            this.init()
        }
                 课程详情页面
        -路由携带参数跳转: 
            <router-link :to="{'name':'courseDetail','params':{'id':course.id}}">详情</router-link>
        -取值:
            course_id: this.$route.params.id,

 

    -图片显示(跟地址绑定) :src='图片地址'   <img :src="course.course_img" class="image">
-路由携带参数跳转: -<router-link :to="{'name':'courseDetail','params':{'id':course.id}}">{{course.name}}</router-link> params:取值 -从另一个页面组件取值: -this.$route.params.id 拿到的就是路由后面的值 -当前页面切换,数据没变 通过watch观察路由的变化 watch:{ '$route':function (to,form) { console.log('to',to); console.log('form',form); //修改课程的id this.course_id=to.params.id; //再去后台加载数据回来 this.init() } } }


 

posted @ 2018-12-25 14:35  粗糙的丸子  阅读(504)  评论(0编辑  收藏  举报