用react怎么做移动端

用react怎么做移动端

1、首先使用create-react-app脚手架创建react项目;

2、然后打开index.html文件,在头部添加meta元数据,设置用户网页的可视区域宽度为设备的宽度,初始缩放比例为1,不允许双指缩放。

<meta name="viewport" content="width=device-width, initial-scale=1, 
    maximum-scale=1, minimum-scale=1, user-scalable=no" />

3、然后正常开发,使用npm start命令启动项目即可。

Snipaste_2019-12-19_14-46-58.jpg

react是适合移动端页面开发的,react是一个用于构建用户界面的JavaScript库,适合的场景是将后端复杂的数据显示在复杂前端复杂的界面上,是非常适合做移动端页面的。

1、声明式

React 可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时 React 也可以高效地更新渲染界面,以声明式编写UI,可以让你的代码更加可靠,且方便调试。

2、组件化

创建好拥有各自状态的组件,再由组件构成更加复杂的界面,无需再用模版代码,通过使用JavaScript编写的组件你可以更好地传递数据,将应用状态和DOM拆分开来。

Image placeholder
前端答疑
未设置
  12人点赞

没有讨论,发表一下自己的看法吧

推荐文章
用react怎么插图片

用react怎么插图片1、img标签引入图片因为react其实是通过js的reader函数渲染的页面,所以直接写src=“路径”是无法引入图片需要用下面的方式引入2、背景图片引入1第一种就是常规的新建

React-native如何变为移动端的弄潮儿

转载本文需注明出处:微信公众号EAWorld,违者必究。引言:随着移动端对用户体验要求越来越友好,以及企业对代码能够跨平台执行的迫切需求。React-Native因此应运而生,从出生就一直备受关注。 

基于vue移动端UI框架有哪些?

vuxVUX(读音[v’ju:z],同views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。文档地址:https://doc.vux.li/zh-CN/演示地址:ht

javascript怎么清除CSS样式?

javascript怎么清除CSS样式?一、使用setAttribute方法清除样式dom结构helloworldjavascriptp.setAttribute('style','');二、使用re

css使用float怎么居中?

css使用float怎么居中?css并没有float:center,但是实现水平居中浮动是可以实现的。以下面的Li列表为例,我们要实现中间LI的居中浮动: 列表一 列表二 列表三 我们需要先了解下

怎么用react写界面

怎么用react写界面用react写页面,官方的做法是采用jsx语法,JSX是一种JavaScript的语法扩展,运用于React架构中,其格式比较像是模版语言,但事实上完全是在JavaScript内

怎么用react写登陆框

怎么用react写登陆框1、创建一个Login组件,添加userName和userPassword状态;2、为输入框绑定onChange事件到changeUsername和changePassword

如何用react做增删

如何用react做增删1、使用react做一个输入框,点击提交在下面列表展示,点击对应的列表项,删除该项,如下:2、项目的数据结构,首先分析需求,一个input框,一个button,一个列表。可以把i

如何用react做一个表格

如何用react做一个表格1、首先使用React.createClass方法创建一个组件;2、在render中通过React.DOM创建table、tr、tbody标签;3、在tr标签中使用map方法

如何用react写页面跳转

如何用react写页面跳转1、使用react-router-dom中的Link实现页面跳转一般适用于,点击按钮或其他组件进行页面跳转,具体使用方式如下:import{Link}from'react-r

如何用react写轮播?

前提:安装好Node.js安装。【推荐阅读:nodejs怎么下载安装?】步骤:1、安装swiper使用node包管理器npm来安装swipernpminstallswiper--save2、在轮播组件

如何引用react-dom

如何引用react-dom引用react-dom很简单,首先你需要创建一个react项目,这里我们介绍两种方式,第一种是使用npm来创建,另一种是采用script标签引入react的方式创建项目。●使

如何使用react做安卓app

如何使用react做安卓app一、首先,我们先创建一个react项目作为演示。1.全局安装create-react-app#全局安装 npminstall-gcreate-react-app2.构建一

如何使用react开发项目

如何使用react开发项目1、环境搭建开发react项目,环境搭建是第一步,react开发需要搭建nodejs环境,因为使用官方的脚手架搭建项目最为简单,而脚手架和webpack依赖于nodejs。w

如何用react构建单页面

如何用react构建单页面react构建单页面需要使用react-router-dom库,所以我们需要先安装npminstallreact-router-dom-S下面以一个例子讲解,react构建单

如何下载使用react.js

如何下载使用react.js一、下载react.js、react-dom.js和babel.js在浏览器中输入这三个地址,将得到的页面全选后复制粘贴到本地的文件中,分别对应react.js、react

如何使用react native

如何使用reactnative一、首先安装react-native-cli脚手架工具npminstall-greact-native-cli二、使用react-native-cli创建一个初始化的工程

深入浅出百亿请求高可用Redis(codis)分布式集群揭秘

摘要:作为noSql中的kv数据库的王者,redis以其高性能,低时延,丰富的数据结构备受开发者青睐,但是由于redis在水平伸缩性上受限,如何做到能够水平扩容,同时对业务无侵入性是很多使用redis

如何利用Reworld做一个一键吸空投箱的效果

功能效果展示运行环境Win7,Win8,Win10Reworld版本体验版vc_redist.x64运行环境针对零基础读者的补充下载安装Reworld对应版本Reworld官网链接:http://ww

css怎么设置div不随滚动条移动?

css怎么设置div不随滚动条移动?把一个内容固定到某一个位置,相对与浏览器窗口进行定位就可以了。这里使用的是fixed定位。定位position通常有absolute绝对定位,relative相对定

从reddit的一亿美元商业逆袭,看移动与PC产品的时代天堑

提起有“互联网头版”之称的reddit,你会联想到什么?想到这一网站上层出不穷的搞笑梗或meme图?还是程序员们经常制造出的各种有趣小发明?说起来在这个体量巨大、包容性极强、时刻制造着互联网新热点的论

慌了,居然被问到怎么做高并发系统的限流

来源:uee.me/cDuRD在开发高并发系统时有三把利器用来保护系统:缓存、降级和限流。本文结合作者的一些经验介绍限流的相关概念、算法和常规的实现方式。缓存缓存比较好理解,在大型高并发系统中,如果没

详解 | 阿里怎么做双11全链路压测?

导读:全链路压测是阿里的首创,本文将从工作内容、操作过程、运行总结等多个方向来介绍下阿里内部典型电商活动(如双11准备),以给大家展示一个完整的压测流程,帮助更多的企业和用户更好的完成性能测试。前言关

多云时代下大规模数据库管理,该怎么做?

中国经济的高速发展是世界各国人们有目共睹的,随着数字经济时代的到来,金融数据库的管理,也随之面对一系列的新技术与挑战。云计算一直以来被认为是极具颠覆性的技术力量,随着云计算的应用普及,越来越为企业重视

Flutter高内聚组件怎么做?闲鱼打造开源高效方案!

fish_redux是闲鱼技术团队打造的开源flutter应用开发框架,旨在解决页面内组件间的高内聚、低耦合问题。开源地址:https://github.com/alibaba/fish-redux从