前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到教程。

代码：

<template><div id="app"><!-- 千米和米换算 --><div id = "computed_props"><input type = "text" v-model = "kilometers"> 千米=<input type = "text" v-model = "meters">米</div><p id="info"></p><br/><!-- 数值计算 --><p>计数器: {{ counter }}</p><button @click = "counter +=2">点一下就自增2</button><br/> <br/>  <br/> <!-- 九九乘法表 --><div v-for="n in 9" :key="n" style = "font-size:25px; color:green"><b v-for="m in n" :key="m">{{m}}*{{n}}={{m*n}}</b></div><br/> <br/>  <!-- 整数范围内迭代 --><!-- <li v-for="n in 10" :key="n"> --><!-- 数组迭代 --><li v-for="n in [1,3,5]" :key="n">{{ n }}</li><br/> <br/>  <!-- 迭代对象属性 键值对 --><ul><li v-for="(value, key) in 小熊" :key="value">{{ key }} : {{ value }}</li></ul><br/> <br/>  <!-- 迭代对象属性 --><ul><li v-for="value in 小熊" :key="value">{{ value }}</li></ul> <br/> <br/>  <!-- 第三个参数为索引 --><ul><li v-for="(value, key, index) in 小熊"  :key="value">{{ index }}. {{ key }} : {{ value }}</li></ul><br/> <br/>  <!-- 带模板的循环 --><ul  v-for="site in sites" :key="site"><li>{{ site.name }}</li><li>--------------</li></ul><br/> <br/>  <!-- 简单循环 --><ol><li v-for="site in sites" :key="site">{{ site.name }}</li></ol><!-- 根据ok的值确定是否显示数据 --><div v-show="ok">为true就显示</div><br/> <!-- 多条件判断 --><div v-if="type === 'A'">A</div><div v-else-if="type === 'B'">B</div><div v-else-if="type === 'C'">C</div><div v-else>Not A/B/C</div></div>
</template><script>export default {name: 'app',data () {return {kilometers : 0,meters:0,counter: 1,type: 'A',ok:false,sites: [{ name: '文文乐园' },{ name: '怕血的小蚊子' },{ name: '火魔灭世' }],小熊: {昵称: '微风轻许',网址: 'https://blog.csdn.net/jiangyu1013',描述: '我的日常笔记'}}},watch : {kilometers:function(val) {this.kilometers = val;this.meters = val * 1000;},meters : function (val) {this.kilometers = val/ 1000;this.meters = val;}}
}</script>

 

运行效果：