console 命令行工具 X clear

console

let app = new Vue({
    el: '#app',
    data: {
        mms:false,
        isActiva:true,
        error:null,
        asd:1,
        type:'name'
    },
    computed:{
        classes:function(){
            return{
                active:this.isActiva&&!this.error,
                'text-fail':this.reeor&&this.reeor.type === 'fail'
            }
        }
    },
    methods:{
        handClack:function(){
            this.type = this.type==='name'?'mail':'name'
        }
    }
})

   <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			[v-cloak] {
				display: none;
			}
            .active{
                background:red
            }
		</style>
	</head>
	<body>
		<div id="app">
            <p :class="{active:mms}">aaa</p>
            <p :class="classes">aaaa</p>
            <p v-if="asd===1">a1</p>
            <p v-else-if="asd===2">a2</p>
            <p v-else>a3</p>
            <template v-if="type==='name'">
                <label for="">用户名：</label>
                <input type="text" placeholder="请输入名字" >
            </template>
            <template v-else>
                <label for="">邮箱：</label>
                <input type="email" placeholder="请输入邮箱" >
            </template>
            <button type="button" @click="handClack">切换类型</button>
        </div>
	</body>
    <scritp>
       
    </scritp>
</html>

本项目引用的自定义外部资源

vue.js