《大数据和人工智能交流》头条号向广大初学者新增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用于展现商品价格,如下图所示:

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属性,如下:

#s001{

width:100px;

height:100px;

border:5px #3F6 solid;

}

#s002{

width:100px;

height:100px;

border:5px red solid;

}

{{ text_value }}

三、vue.js的流程控制

案例1:选择结构练习

有如下商品表数据:

要求:如果商品编号为goods001,则显示价格为100元,如果商品编号为goods002,则显示价格为200元,如果商品编号为goods003,则显示价格为300元,否则显示“没有标价”,如下所示:

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本书的书名:

  1. {{ goods.goodsName }}

案例3:将对象中的数据循环输出到无序标签

  • {{ v }}

四、vue.js的样式处理

如下列图片所示,使用v-bind:class属性实现点击《加边框》按钮,给图片加一个蓝色的边框:

.c001 {

width: 300px;

height: 220px;

background: green;

border:5px blue solid;

}

img{

width: 300px;

height: 220px;

}

五、vue.js的事件处理

使用vue.js事件绑定实现将一段文字改变颜色,如下所示:

.c_red{

color:red;

}

.c_blue{

color:blue;

}

大漠孤烟直

变红

变蓝

六、vue.js表单处理

使用vue.js对复选框进行数据绑定,自动计算商品总价格,如下图所示:

商品列表:

《大数据导论》¥100元

《机器学习导论》¥200元

《智能传感器》¥300元

总价格为:{{calculatePrice()}}元

《大数据和人工智能交流》的宗旨

1、将大数据和人工智能的专业数学:概率数理统计、线性代数、决策论、优化论、博弈论等数学模型变得通俗易懂。

2、将大数据和人工智能的专业涉及到的数据结构和算法:分类、聚类 、回归算法、概率等算法变得通俗易懂。

3、最新的高科技动态:数据采集方面的智能传感器技术;医疗大数据智能决策分析;物联网智慧城市等等。

根据初学者需要会有C语言、Java语言、Python语言、Scala函数式等目前主流计算机语言。

根据读者的需要有和人工智能相关的计算机科学与技术、电子技术、芯片技术等基础学科通俗易懂的文章。

android应用案例开发大全_vue.js入门及经典应用案例总结(前端开发必看)相关推荐

  1. (转)web前端开发分享-css,js入门篇

    关注前端这么多年,没有大的成就,就入门期间积累了不少技巧与心得,跟大家分享一下,不一定都适合每个人,毕竟人与人的教育背景与成长环境心理活动都有差别,但就别人的心得再结合自己的特点,然后探索适合自己的学 ...

  2. cropper.js 图像旋转问题_快速提高前端开发效率:10个JavaScript图像处理库

    用JavaScript处理图像可能非常困难且繁琐.幸运的是,有许多库可以使事情变得简单得多.以下就是一些前端开发经常要使用到的图片处理库,和千锋广州前端小编一起来看看吧! 如果发现有用的东西,请尝试将 ...

  3. php获取扫码枪的内容,一起看看js获取扫码枪输入数据的方法_WEB前端开发

    代码详解Vue中key的作用示例_WEB前端开发 key的特殊attribute主要用在Vue的虚拟DOM算法,在新旧Nodes对比时辨识VNodes,这篇文章主要给大家介绍Vue中key的作用,感兴 ...

  4. vue 新建的页面如何访问_Vue.js—实现前后端分离架构中前端页面搭建(四)(完)...

    [Vue.js实现前后端分离架构中前端页面搭建] 二十.实现服务端登录业务 前提:已经有单机版Eureka,端口8761.启动开Eureka 1. 新建父项目 新建backend_parent. 为了 ...

  5. 前端开发技术栈(插件篇):400+常用前端开发插件总结清单(持续更新......)

    常用前端开发插件总结清单,日常前端开发的时候,尤其在使用一些常用的功能的时候,例如:表单,,动画效果,时间选择,文件上传,下拉框等功能.直接用插件可以让自己节省更多的开发时间,更多的去关心业务,自己封 ...

  6. 《Nodejs开发加密货币》之三:Nodejs让您的前端开发像子弹飞一样

    关于 <Nodejs开发加密货币>,是一个加密货币产品的详细开发文档,涉及到使用Nodejs开发产品的方方面面,从前端到后台.从服务器到客户端.从PC到移动.加密解密等各个环节.代码完全开 ...

  7. Web前端新手必看的7种技术,从菜鸟到高级开发的蜕变!

    随着互联网发展,Web前端开发逐渐走红.由于大学没有开设前端课程,知识体系不够规范完整,每个人对它的认识也各不相同,加之互联网技术更新迭代迅速今天给你解读一下,学习Web前端的基本需要掌握的知识. 具 ...

  8. 开发pc页面_干货分享:2020年Web前端开发学习路线图

    2020年是充满机遇与挑战的一年,这一年注定不平凡.随着5G商用.传统产业数字化转型加快,我们完全可以想象到互联网行业即将迎来自己的"高光时刻",因此,现在学习Web前端正当时. ...

  9. 前端人必看的JS面试题汇总

    面试是每一个前端人在求职过程中都需要面对的事情.在面试过程中,面试官没有办法通过实践操作去了解应聘者的技能水平,所以他们更多地会通过"八股文"的考察来判断你是否符合公司的招聘要求. ...

最新文章

  1. 【Android Developer】2.Android的第一个Helloworld程序
  2. nginx的error.log日志常见的几个错误解决方法
  3. 16进制/10进制数转化为浮点型案例
  4. ML之回归预测:机器学习中的各种Regression回归算法、关键步骤配图
  5. .net core 2.0部署到CentOS7系统
  6. semiautomatic annotated tools
  7. 曼哈顿距离最小生成树
  8. VS2010 NDoc的插件工具
  9. Nginx 重写规则指南
  10. js统计字符串中特定字符出现的个数
  11. itext7相关使用
  12. 英文java简历模板下载_java英文简历模板
  13. windows域环境搭建上
  14. MyBatis批量的增删改查操作
  15. 简单聊聊Long Short Term Memory Network (LSTM)和 Gated Recurrent Unit (GRU)两种强大的RNN变体
  16. 统计基础(五)假设检验中的检验方法
  17. ACM-ICPC Jiaozuo Onsite 2018 Resistors in Parallel (思维+java大数+找规律)
  18. MongoDB 空间定位(点) 与 距离检索
  19. 如何在Apple Watch上管理您的朋友圈
  20. 学习python之积累别人的好东西

热门文章

  1. 从流程上对rtmp协议经行总结
  2. go语言json字符串解析为结构体数组,结构体指针的数组
  3. leetcode 482. 密钥格式化(Java版)
  4. 可关闭的浮动div示例
  5. 小师妹学JVM之:JIT中的PrintAssembly续集
  6. Java 9 尝鲜之JShell交互式编程环境
  7. 云计算与分布式计算,网格结算,对等计算,并行计算..的关系
  8. 容器源码分析之ArrayList(二)
  9. Effective Java之使类和成员的可访问性最小化(十三)
  10. ByteBuf的源码分析