前些天發(fā)現(xiàn)了一個(gè)巨牛的人工智能學(xué)習(xí)網(wǎng)站，通俗易懂，風(fēng)趣幽默，忍不住分享一下給大家。點(diǎn)擊跳轉(zhuǎn)到教程。

1. 寫法：

<template><div id="app"><!-- 三目運(yùn)算符使用 ‘ok’ 的值定義在 data 中-->{{ ok ? 'YES' : 'NO' }}<br><br><!-- 修改樣式 class1 設(shè)置為 true 時(shí)顯示樣式(頁(yè)面上勾選單選框即設(shè)置為 true)--><label for="r1">修改顏色</label><input type="checkbox" v-model="class1" id="r1"><br><div v-bind:class="{'class1': class1}">我會(huì)變背景顏色</div><!-- if判斷 --><p v-if="seen"> seen 設(shè)置為true , 你就能看到我了 </p><!-- 參數(shù)在指令后以冒號(hào)指明 1.‘ v-bind:href="url" ’可以簡(jiǎn)寫為：‘ :href="url"’ 2.target參數(shù)作用：新窗口打開 --> <pre><a v-bind:href="url" :target="target">這是鏈接</a></pre><!-- 點(diǎn)擊事件 ‘v-on:click=’可以簡(jiǎn)寫為：‘@click=’ --><button v-on:click="doSomething">點(diǎn)擊事件</button><br><br><!-- 管道處理數(shù)據(jù) message 原值：this (slice方法是切片，去掉前n位字母) -->{{ message | capitalize }}</div></template><script>export default {name: 'APP-two',data () {return {ok: true,class1: false,seen: true,url: 'https://blog.csdn.net/jiangyu1013',target:'_blank',message:'this'}},methods: {doSomething: function() {alert(" 我要給小熊造一個(gè)完美世界！");}},filters: {capitalize: function (value) {if (!value) return ''value = value.toString()return value.charAt(3).toUpperCase() + value.slice(1)}} }</script><style> .class1{background: #444;color:white } </style>

2. 運(yùn)行效果：（seen 設(shè)置為 true?）

總結(jié)

以上是生活随笔為你收集整理的Vue.js 极简小例：读值、样式调用、if判断、a 标签、点击事件、管道的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。