vue.js   组件化构建 组件系统是 Vue 的另一个重要概念,因为它是一种抽象,允许我们使用小型.自包含和通常可复用的组件构建大型应用.仔细想想,几乎任意类型的应用界面都可以抽象为一个组件树: 一.使用组件 1.组件的全局注册--可以使用 Vue.component(tagName, options) Vue.component('my-component', { // 选项 }) 组件在注册之后,便可以在父实例的模块中以自定义元素** <my-component></my-com…
本文提供一个简单的方法实现一个流程的进度条加载效果,以便在页面中可以通过它来更好地反馈耗时任务的完成进度.要实现这个功能,首先要考虑怎样实现一个静态的进度条效果,类似下面这样的: 这个倒是比较简单,两个div即可,bootstrap官方就提供有多种主题的进度条组件.如果自己要用,参照下别人的代码,写成自己的风格即可,实际上也非常的好理解: .progress { height: 20px; background-color: #f5f5f5; border-radius: 4px; box-sh…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>hello world</title> </head> <body> <div id="app"> <div> <!-- 4.<router-link>默认会被渲染成一个…
前言 前端已经过了单兵作战的时代了,现在一个稍微复杂一点的项目都需要几个人协同开发,一个战略级别的APP的话分工会更细,比如携程: 携程app = 机票频道 + 酒店频道 + 旅游频道 + ...... 每个频道有独立的团队去维护这些代码,具体到某一个频道的话有会由数十个不等的页面组成,在各个页面开发过程中,会产生很多重复的功能,比如弹出层提示框,像这种纯粹非业务的UI,便成了我们所谓的UI组件,最初的前端组件也就仅仅指的是UI组件. 而由于移动端的兴起,前端页面的逻辑已经变得很重了,一个页面的…
封装的组件(SelectDefault.vue文件): <template> <div class="select-default"> <label>{{title}}</label> <div class="textwarm"> <input type="text" @click="showPicker" v-model="inputText&quo…
常用的到的网站 vue学习库: https://github.com/vuejs/awesome-vue#carousel (json数据的格式化,提高本地测试的效率) json在线编辑: http://www.bejson.com/http://www.kjson.com/ //提供fake的数据:http://jsonplaceholder.typicode.com/users /posts 100 posts/comments 500 comments/albums 100 albums/…
在很多应用中,往往都涉及到记录用户所在省份.城市.区县或者街道等信息,一般我们可以通过联动的Select或者类似的界面组件进行展示,或者使用Element中的el-cascader界面组件进行展示,而全国的省份.城市.区县或者街道等信息我们可以通过官方的数据进行获取,可以直接存放在JS里面,也可以存储在自己的数据库里面,最后统一进行联动展示即可.本篇随笔介绍几种组件对省市区县联动处理的效果及做法,可以直接应用在我们项目中,也可以做为一个组件开发的参考学习. 1.基于element-china-a…
一.Vue的生命周期 生命周期就是指一个对象的生老病死的过程. 用Vue框架,熟悉它的生命周期可以让开发更好的进行. 所有的生命周期钩子自动绑定 this 上下文到实例中,因此你可以访问数据,对属性和方法进行运算.这意味着,你不能使用箭头函数来定义一个生命周期方法 (例如 created: () => this.fetchTodos()).这是因为箭头函数绑定了父上下文,因此 this 与你期待的 Vue 实例不同,this.fetchTodos 的行为未定义. 生命周期的钩子函数,就是vue实…
本来想这一周做一个关于vuex的总结的,但是由于朋友反应说还不知道如何用vue去写一个组件,所以在此写写一篇文章来说明下如何去写vue页面或者组件.vue的核心思想就是组件,什么是组件呢?按照我的理解组件就是装配页面的零件,比如一辆车有大大小小许多零件组成,那么同样的一个页面,也是有许多组件构成的比如说头部组件 按钮组件等等,vue三大核心组件 路由 状态管理,路由控制页面的渲染,页面由组件组成,数据有vuex进行管理和改变.下面我会以一个简单的案例来说 第一步:构建一个简单的vue项目,老规矩…
之前接触最多的都是EasyNVR,主要针对的都是前端的一些问题.也有接触到一些easydss流媒体服务器. 前端方面的,EasyDSS流媒体服务器与EasyNVR有着根本的不同.EasyNVR使用的是传统的js来进行开发.而EasyDSS使用的是webpack+vue来进行开发的. 能了解到vue+webpack的应该都需要介绍他的好处了吧. 我也是在这里才接触的vue.我在后续的博客中也会记录下自己的一些学习vue的体会.心得. 之前没有接触过vuejs.由于开发需求,需要在easydss流媒…