前端组件

Vue 渐进式 JavaScript 框架 通过对框架的了解与运用程度，来决定其在整个项目中的应用范围，最终可以独立以框架方式完成整个web前端项目 一、走进Vue 1、what -- 什么是Vue 可以独立完成前后端分离式web项目的JavaScript框架 2、why -- 为什么要学习Vue 三大主流框架之一：Angular React Vue 先进的前端设计模式：MVVM 可以完全脱离服务器端，以前端代码复用的方式渲染整个页面：组件化开发 3、special -- 特点 单页面web应用 数据驱动 数据的双向绑定 虚拟DOM 4、how -- 如何使用Vue 开发版本： vue.js 生产版本： vue.min.js <div id="app"> {{ }} </div> <script src="js/vue.min.js"></script> <script> new Vue({ el: '#app' }) </script> 二、Vue实例 1、el：实例 new Vue({ el: '#app' }) // 实例与页面挂载点一一对应 // 一个页面中可以出现多个实例对应多个挂载点 // 实例只操作挂载点内部内容 2、data：数据 <div id='app'> {{ msg }} </div> <script> var app = new Vue({ el: '

Vue 渐进式 JavaScript 框架 通过对框架的了解与运用程度，来决定其在整个项目中的应用范围，最终可以独立以框架方式完成整个web前端项目 一、走进Vue 1、what -- 什么是Vue 可以独立完成前后端分离式web项目的JavaScript框架 2、why -- 为什么要学习Vue 三大主流框架之一：Angular React Vue 先进的前端设计模式：MVVM 可以完全脱离服务器端，以前端代码复用的方式渲染整个页面：组件化开发 3、special -- 特点 单页面web应用 数据驱动 数据的双向绑定 虚拟DOM 4、how -- 如何使用Vue 开发版本： vue.js 生产版本： vue.min.js <div id="app"> {{ }} </div> <script src="js/vue.min.js"></script> <script> new Vue({ el: '#app' }) </script> 二、Vue实例 1、el：实例 new Vue({ el: '#app' }) // 实例与页面挂载点一一对应 // 一个页面中可以出现多个实例对应多个挂载点 // 实例只操作挂载点内部内容 2、data：数据 <div id='app'> {{ msg }} </div> <script> var app = new Vue({ el: '

Vue.js新手入门指南 最近在逛各大网站，论坛，以及像SegmentFault等编程问答社区，发现Vue.js异常火爆，重复性的提问和内容也很多，楼主自己也趁着这个大前端的热潮，着手学习了一段时间的Vue.js，目前用它正在做自己的结业项目。 在做的过程中也对Vue.js的官方文档以及其各种特性有了许多认识。作为一个之前以PHP+模版引擎为主的开发，从一个从未接触过除HTML+CSS+JavaScript+JQuery以外的前端技术的人到现在可以独立使用Vue.js以及各种附属的UI库来开发项目，我总结了一些知识和经验想与大家分享。 下面我就以问答的形式来分享吧。这里假设你仅仅只掌握了HTML+CSS+JavaScript，如果你对JQuery这个前端库，以及各种后端模版语言比如说PHP，JSP还有所了解并且使用过的话那就太好了。 1.Vue.js是什么？ Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

对于Angular我们知道，其是一款来自谷歌的用HTML和TypeScript构建客户端应用的平台与的开源 web 框架。而Angular本身就是用TypeScript 开发而成的。它将核心功能和可选功能作为一组 TypeScript 库进行实现，可以根据需求把它们导入到应用中。 Angular 的基本构造块是NgModule，它为组件提供了编译的上下文环境。NgModule会把相关的代码收集到一些功能集中。事实上Angular应用就是由一组NgModule定义出的。 应用只会有会有一个用于引导应用的根模块，当然了我们可以根据需要定义需要子根模块，通常我们还会引用其他特性的模块或者我们的自定义模块。 那我们要怎么样才能快速搭建和部署Angualr项目呢？ 搭建技巧 准备工作 安装nodejs。安装稳定版本 Node.js 安装包及×××地址为： https://nodejs.org/en/download/ 。 安装cnpm。这个是由于墙的原因，通过这个方式，使我们在构建项目的时候不会花过多的时间。通过cnpm我们设置淘宝源作为代理，加速我们的安装进程 npm install -g cnpm --registry= https://registry.npm.taobao.org 使用npm/cnpm安装angular/cli。 npm install -g @angular/cli

TypeScript 为 JavaScript 带来静态类型检查，让 JavaScript 编写中大型应用的时候可以应用工具来避免部分错误。 Vue 很早就支持 TypeScript，但配置起来比较麻烦，幸好有了 Vue CLI 3.0。安装好 vue-cli 之后，使用 vue create 项目名称 来创建项目，vue 脚本手架自动创建以项目名称命名的目录。 vue-cli 3 生成的项目结构比较科学，尤其是通过 components 和 views 将作为控件的组件和作为页面的组件分离开来，结构更清晰。可以理解为 views 中定义的组件是要配置在路由中的，而 componets 中定义的组件是被其它组件调用的。 HTML 需要定义一个 <div> 作为 Vue 应用的容器，main.ts 中会通过 new Vue(...) 生成应用实例并将之与容器绑定。注意 HTML 中定义的 <div id="app"></div> 会被 App.vue 模板中定义的 <div id="app">...</div> 替换掉。 Vue 是一个组件化的框架，组件是 Vue 的基本元素。一个 Vue 应用是由若干组件构成的，组件与组件之间的嵌套或并列关系，最终可以用树形来表示。main.ts 中创建的 Vue 实例是最顶层组件。 每个 Vue 组件都有三个组成部分，即骨架（HTML）、样式

一 react简介 1 react 简介 React 是一个用于构建用户界面的 JAVASCRIPT 库。 React 主要用于构建UI，很多人认为 React 是 MVC 中的 V。 React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。 React 拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和使用它。 React 是解决前端MVC框架中的view视图层的问题 M 是指数据模型,V是指显示的问题，C是指控制的问题 2 React 特点 1.声明式设计 −React采用声明范式，可以轻松描述应用。 2.高效 −React通过对DOM的模拟，最大限度地减少与DOM的交互。 3.灵活 −React可以与已知的库或框架很好地配合。 4.JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ，但我们建议使用它。 5.组件 − 通过 React 构建组件，使得代码更加容易得到复用，能够很好的应用在大项目的开发中。 6.单向响应的数据流 − React 实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。 3 Virtual DOM DOM (文档对象模型 document object model)