记录vue使用过程中的细节

1、vue 标签上使用三元表达式

三元表达式
1、标签中
<span class="week">{
    
    {
    
     state ? '第一周': "题目" + state }}</span>
2、标签内
<div :class="state ? 'next' : 'start'" @click="handleClick"></div>
<div :class="['start', state ? 'next' : '']" @click="handleClick"></div>

3、普通表达式
<span class="week" v-show="!state">第一周</span>
<span class="week" v-show="state" v-if="state">题目{
    
    {
    
     state }}</span>

2、vue 打开一个新的界面，并传递信息

//打开新页面
editCourseMsg(index,row){
    
    
                let routeData = this.$router.resolve({
    
    
                    path:'/courseMsg',
                    query:{
    
    id: '000'}
                });
                window.open(routeData.href, '_blank');
            }
//新页面接受数据
this.$route.query

3、el-popconfirm 官方给的的confirm不起作用时

//在把confirm改成 @onConfirm
<template>
   <el-popconfirm
    title="这是一段内容确定删除吗？"
   	@onConfirm="handleDelete(scope.$index, scope.row)">
    <el-button
        slot="reference"
        size="mini"
        type="danger">删除</el-button>
   </el-popconfirm>
</template>