vue与react哪种好?
时间:2022-06-19
本文章向大家介绍vue与react哪种好?,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
vue与react,到目前为止两个我都用来写了好多项目,vue用的脚手架是vue-cli,react用的是dva,两者都对其进行了很好的封装,只需要简单的几步就能跑起来.
之前在国外一大神讨论这两者之间的区域,说vue是框架,react是库,刚开始真的不已为然,觉得两者应该都是框架,现在想来,还是自己太年轻了,vue是更偏向框架,而react更偏向库,vue封这众多的方法,包括v-if,v-for,v-show,过滤器,指令等等,对于从react转向vue的我来说,确实有很多不方便了,react写习惯了,习惯了自己手动来写这些东西,转到vue后,本以为能用类似的方式来实现,结果纯属浪费时间.
举个例子:
在vue中,用的最多的UI组件是element,react中,国内用的多的是antd.这两个中有一个table组件,在vue中,由于没有render的api,当你从后端获取数据后,需要展示到页面上的内容又不是后端给过来的,需要经过一层转换,你就不得不这样写:
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="date"
label="日期"
sortable
width="180"
:filters="[{text: '2016-05-01', value: '2016-05-01'}, {text: '2016-05-02', value: '2016-05-02'}, {text: '2016-05-03', value: '2016-05-03'}, {text: '2016-05-04', value: '2016-05-04'}]"
:filter-method="filterHandler"
>
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址"
:formatter="formatter">
</el-table-column>
<el-table-column
prop="tag"
label="标签"
width="100"
:filters="[{ text: '家', value: '家' }, { text: '公司', value: '公司' }]"
:filter-method="filterTag"
filter-placement="bottom-end">
<template slot-scope="scope">
<el-tag
:type="scope.row.tag === '家' ? 'primary' : 'success'"
disable-transitions>{{scope.row.tag}}</el-tag>
</template>
</el-table-column>
</el-table>
不得不在最后一行加上template 这样的关键字,这样造成的影响便是,你无法使用组件精减代码,你必须定义各种 <el-table-column>;这让我是非常难受的.
在react中,当你使用antd作为UI组件的时候,你便可以用column这个api里的render函数来定义相应的样式等等.
个人更喜欢用react.
- 加拿大滑铁卢大学刘腾博士:平行增强学习及其无人驾驶应用
- 曾六位数被秒的yadea.com 终端真是雅迪!
- 2018年IT行业必须面对的7个改变
- SqlTransaction 数据库编程事务使用示例
- 再谈web.config/app.config敏感数据加/解密的二种方法
- NVIDIA颁布最新禁令,GeForce不能再行深度学习了!
- 2017年终盘点:请留意这七项科学技术的最新进展
- 什么叫做真正的无人驾驶汽车?难道真的没有人么?
- 零基础学习人工智能之Python篇1-Python定义
- aspx超时问题容易忽略的细节
- 给最后一周下个猛料,JavaScript 2017 使用调查!
- MongoDB快速入门
- AI:被过度夸大
- setInterval()与clearInterval()的用法
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 算法篇:摩尔投票法的使用
- 理解ECMAScript规范(2)
- 算法篇:数的转换
- React 开发要知道的 34 个技巧
- 算法篇:求1的个数
- 新特性解读 | MySQL 8.0 语句摘要功能介绍
- 10个不那么知名但很实用的Web API
- 技术分享 | 一文了解高并发限流算法
- prometheus-operator 监控 k8s 外部集群
- Kubernetes 通过statefulset部署redis cluster集群
- 猿实战13——实现你没听说过的前台类目
- 猿实战14——前台类目之广告牌设置
- 猿实战15——关联你所不明白的前后台类目
- 完美解决方案-雪花算法ID到前端之后精度丢失问题
- 猿实战16——承运商之搭建你的运费基石