0
点赞
收藏
分享

微信扫一扫

vue和react的介绍

这几年前端框架发展的不错,出了不少框架,像微软自己的knockoutjs,angular,vue和最近比较火的react等,之前我有写过前两者的相关文章,今天主要说一下后两者。

介绍

  1. 是一个用于构建用户界面的 JAVASCRIPT 库。
  2. 主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。
  3. 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它。

特点

  1. 声明式设计 −React采用声明范式,可以轻松描述应用。
  2. 高效 −React通过对DOM的模拟,最大限度地减少与DOM的交互。
  3. 灵活 −React可以与已知的库或框架很好地配合。
  4. JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ,但我们建议使用它。
  5. 组件 − 通过 React 构建组件,使得代码更加容易得到复用,能够很好的应用在大项目的开发中。
  6. 单向响应的数据流 − React 实现了单向响应的数据流,从而减少了重复代码,这也是它为什么比传统数据绑定更简单。

大叔的vue和react开源项目

  1. vue:​​https://github.com/bfyxzls/vue​​
  2. react:​​https://github.com/bfyxzls/reactjs​​

helloworld程序

vue hello world

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>

react hello world

// 安装环境
npm install -g cnpm --registry=https://registry.npm.taobao.org
npm config set registry https://registry.npm.taobao.org
cnpm install -g create-react-app
// 建立react项目
npx create-react-app my-app
cd my-app
npm start
// 修改App.js文件,加入个性化元素
// App.js是程序的入口,在这里面可以引用其它的模块(组件Component)
import React, { Component } from "react";
import "./App.css";

class App extends Component {
constructor(props) {
super(props);
this.state = {
total: 0,
next: null,
operation: null
};
}

render() {
return (
<div className="component-app">
<h1>hello world!</h1>
<p>总数:{this.state.total}</p>
</div>
);
}
}

export default App;

本文章主要是一个vue和react介绍和入门的文章,以后给再深入介绍!

作者:仓储大叔,张占岭,
荣誉:微软MVP

vue和react的介绍_支付宝



举报

相关推荐

0 条评论