《大数据和人工智能交流》头条号向广大初学者新增C 、Java 、Python 、Scala、javascript 等目前流行的计算机、大数据编程语言,希望大家以后关注本头条号更多的内容。
一、vue.js入门案例
示例-1:向页面输出大名鼎鼎的“hello world”:
#s001{
width:100px;
height:100px;
border:5px #3F6 solid;
}
{{ message }}
示例-2:vue.js的对象的应用
自己生命一个商品goods,属性有商品编号,商品名称;定义个方法为showPrice用于展现商品价格,如下图所示:
![65bc9a4cbb046c0d44e04d351c5c083a.png](https://i-blog.csdnimg.cn/blog_migrate/2f0395cbbfacbf0e5d81ff691a89905f.jpeg)
table{
width:350px;
border:1px #ccc solid;
}
td{
border:1px #999 solid;
text-align:center;
}
p{
color:red;
}
商品编号 | 商品名称 | 商品价格 |
{{goods_id}} | {{goods_name}} | {{ShowPrice()}} |
二、vue.js模板案例
向两个div域中分别写入文本属性和html属性,如下:
![1500392dd639b49140d848cf86536c5e.png](https://i-blog.csdnimg.cn/blog_migrate/2d873b602041a05fe22053fc493ec52d.jpeg)
#s001{
width:100px;
height:100px;
border:5px #3F6 solid;
}
#s002{
width:100px;
height:100px;
border:5px red solid;
}
{{ text_value }}
三、vue.js的流程控制
案例1:选择结构练习
有如下商品表数据:
![da79fdde96f059ff3e6650c625132dc6.png](https://i-blog.csdnimg.cn/blog_migrate/5dd583d860b2a7b84d7e8d6b001bd053.jpeg)
要求:如果商品编号为goods001,则显示价格为100元,如果商品编号为goods002,则显示价格为200元,如果商品编号为goods003,则显示价格为300元,否则显示“没有标价”,如下所示:
![e6e9a2ab11ff1b7cf04bb6e22db04671.png](https://i-blog.csdnimg.cn/blog_migrate/a0cdae8dbc1df211236fc86edf442f1b.jpeg)
table{
border:1px #999 solid;
width:350;
text-align:center;
}
td{
border:1px #999 solid;
}
.c01{
background:#ccc;
}
商品编号 | 商品名称 | 商品价格 | |||
goods002 | vue.js | 100元 | 200元 | 300元 | 没有标价 |
案例2:循环结构
在一个无序标签里面,循环输出3本书的书名:
![df0ea32dd49f9fa51a029eda9b225207.png](https://i-blog.csdnimg.cn/blog_migrate/eabbe003fafe6616006bc68471c0726f.jpeg)
{{ goods.goodsName }}
案例3:将对象中的数据循环输出到无序标签
{{ v }}
四、vue.js的样式处理
如下列图片所示,使用v-bind:class属性实现点击《加边框》按钮,给图片加一个蓝色的边框:
![078209604a31e062e26c615802c27f57.png](https://i-blog.csdnimg.cn/blog_migrate/eda33c08e9e561f73d7b0721d65363ec.jpeg)
.c001 {
width: 300px;
height: 220px;
background: green;
border:5px blue solid;
}
img{
width: 300px;
height: 220px;
}
五、vue.js的事件处理
使用vue.js事件绑定实现将一段文字改变颜色,如下所示:
![7fc178137f2e888ccdeaec42e41b597a.png](https://i-blog.csdnimg.cn/blog_migrate/b9f568bb86b5e80c6bceabb49ad3dcfa.jpeg)
.c_red{
color:red;
}
.c_blue{
color:blue;
}
大漠孤烟直
变红
变蓝
六、vue.js表单处理
使用vue.js对复选框进行数据绑定,自动计算商品总价格,如下图所示:
![ee9b6f38e124ebc196b4dd3c82e9b4f3.png](https://i-blog.csdnimg.cn/blog_migrate/ad257d1f96864736e080627a4c03bc0a.jpeg)
商品列表:
《大数据导论》¥100元
《机器学习导论》¥200元
《智能传感器》¥300元
总价格为:{{calculatePrice()}}元
![7dfeaefe6f4b7a4578975cc2dbe40dd0.png](https://i-blog.csdnimg.cn/blog_migrate/81a57d3c9b74e92e8a0a3518dc1d75f6.jpeg)
《大数据和人工智能交流》的宗旨
1、将大数据和人工智能的专业数学:概率数理统计、线性代数、决策论、优化论、博弈论等数学模型变得通俗易懂。
2、将大数据和人工智能的专业涉及到的数据结构和算法:分类、聚类 、回归算法、概率等算法变得通俗易懂。
3、最新的高科技动态:数据采集方面的智能传感器技术;医疗大数据智能决策分析;物联网智慧城市等等。
根据初学者需要会有C语言、Java语言、Python语言、Scala函数式等目前主流计算机语言。
根据读者的需要有和人工智能相关的计算机科学与技术、电子技术、芯片技术等基础学科通俗易懂的文章。