React 语法之let和const命令

最新推荐文章于 2024-02-03 00:22:25 发布
最新推荐文章于 2024-02-03 00:22:25 发布
阅读量1.8w 收藏 5
点赞数 3
分类专栏： React Native
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiangzhihong8/article/details/52366380
版权

let命令

基本用法

ES6新增了let命令，用来声明变量。它的用法类似于

了解本专栏 订阅专栏 解锁全文 超级会员免费看
xiangzhihong8
关注
  • 3
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
订阅专栏
ReactV 15.5.0 从入门到精通第二章 React语法基础let和c
11-06
ReactV 15.5.0 从入门到精通第二章 React语法基础let和const命令
React 组件转 Vue 组件的命令写法
11-26
基于目前React和Vue比较火，开发react-to-vue 工具的目的是为了进一步提高组件的可复用用性，让组件复用不仅仅局限在一个框架里面 简介 对于react-to-vue工具，转化的是基本的react component，而不是全部的react...
React之 const App: React.FC = () =＞ { 和 export default () =＞ {的区别是什么
最新发布
西京刀客
02-03 227
onst App: React.FC = () => {} 和 export default () => {} 都是创建一个匿名的函数组件，它们的区别在于导出方式的不同。 const App: React.FC = () => {} 是通过 const 关键字创建了一个命名的函数组件，并将其赋值给 App 变量。这个函数组件的名称是 App，可以在代码中被引用，也可以在其他文件中通过 import 导入使用。
react入坑学习（一）const 的用法
JeffanChen的博客
05-21 7698
解构赋值const 的用法const 概念const 几种用法用法一:用法二: const 的用法 在公司初次学习react，记录一点学习成果 const 概念 const 用于声明一个或多个常量，声明时必须进行初始化，且初始化后值不可再修改; const 几种用法 可以参照 菜鸟教程. 用法一: const PI = 3.141592653589793; PI = 3.14; // 报错 PI = PI + 10; // 报错 const 声明的常量必须初始化 const 的本质: con
React
qq_41256253的博客
09-26 277
1. React有什么特点？ 它遵循单向数据流或数据绑定。 2. JSX JSX 是J avaScript XML 的简写。是 React 使用的一种文件，它利用 JavaScript 的表现力和类似 HTML 的模板语法。这使得 HTML 文件非常容易理解。此文件能使应用非常可靠，并能够提高其性能。下面是JSX的一个例子： render(){ return( <div> <h1> Hello World fr
React初级教学
LoveZJC96的博客
03-28 1355
1.什么是React React 是一个用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面，这些代码片段被称作“组件”。所以React是用组件搭建页面 2.JSX 语法 JSX 它是一种JavaScript语法扩展，可以将HTML 语言直接写在 JavaScript 语言之中，不加任何引号。 单标签使用/>来闭合标签 如： const element = <h1>Hello, world!</h..
用react渲染抽象语法树-React开发
05-27
react-ast使用react渲染抽象语法树。如果您发现它有用，请★此仓库★★★本质上很难使用抽象语法树。 这是一个React渲染器，它可以使用react与Abstrac react-ast交互来渲染抽象语法树。如果您发现它有用，请★此仓库...
react-ReactcreateElement和JSX替代语法糖
08-15
React.createElement和JSX替代语法糖
React学习基本语法
02-20
这是我学习 React 写的第一个程序，也是React的最基本的语法，上传到这里，和大家交流学习
小程序中 var，let，const用法详解
IT_LPF的博客
01-21 1496
1.Var命令 var申明的变量是全局变量，其作用域为所在的函数内。如下图1所示 var命令会发生”变量提升“现象，即变量可以在声明之前使用。如下图2所示 2.Let命令 let声明的变量是局部变量，该变量只会在最靠近{ }内的范围有效，出了{}之后，该变量就不能用了，否则会报该变量未定义的错误。 let声明的变量只在它所在的代码块有效。 for循环的计数器，就很合适使用let命令。 let不允许在相同作用域内，重复声明同一个变量 3.Const命令 const声明一...
React基础知识
梦想成为全栈的切图仔
10-10 515
（3）在主store下的reducer中引入各个组件的reducer 以及统一的reducer管理工具 combineReducers 用来统一合并reducer。（4）在对应使用的页面则需要在 store.state.header.focused 中间添加header 组件来获取使用。c. 在对应组件的store的index.js中引入constants 跟actionCreators 两个文件。（2）在对应组件的文件夹store下新建文件actionCreators来表示对应的dispatch方法。
let和const
热门推荐
qq_34771938的博客
09-20 1万+
let和const是什么 var声明变量。 let代替var，声明变量。 const声明常量。 let和const的用法 什么是变量，什么是常量 var、let声明的就是变量，变量一旦初始化之后，还可以重新赋值。 const声明的就是常量，常量一旦初始化，就不能重新赋值了，否则就会报错。 为什么需要const const就是为了那些一旦初始化就不希望重新赋值的情况设计的。 const的注意事项 使用const声明常量...
学习react 笔记二 （组件）
^_^
05-27 385
一、组件 组件呢 一般还是挺常用的 但react怎么创建组件呢 1.函数组件 const Com = function () { return (<div>奥特曼</div>) } 2.类组件 import { Component } from 'react' // 提供最核心的react组件功能 // 注意 固定写法 class Com extends Component { render () { return <div>{remdo
ReactHooks总结
青春微凉、不悲伤℃
06-19 280
占位
微信小程序数组与字符串操作函数
北海_南风
05-16 3230
这里写目录标题字符串substr：母串提取concat：字符串拼接indexOfBytes：字符串查找strcasecmp：不区分大小写比较toLower:将字符串转化为小写并返回toUpper:将字符串转化为大写并返回官方文档：数组indexOfArray:查找元素下标isArray：判断是否为数组，返回布尔值in：判断值是否在数组里，返回布尔objectToArray：将对象转换成数组reverseArray：数组倒序unshift：往数组头部添加一个或多个值。push：往数组尾部添加一个或多个值。po
React之const语句
qq_42420970的博客
05-29 5358
以下内容都摘自： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const 常量是块级作用域，很像使用let语句定义的变量。常量的值不能通过重新赋值来改变，并且不能重新声明。 一、demo const number = 42; try { number = 99; } catch (err) { console.log(err); // expected output: TypeErro
const j = ['立春', '惊蛰', '清明', '立夏', '芒种', '小暑', '立秋', '白露', '寒露', '立冬', '大雪', '小寒'] const News = () => { const formatDate = (date) => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const hour = date.getHours() const minute = date.getMinutes() const lunarDate = calendar.solar2lunar(year, month, day) const startDate = new Date(lunarDate.date) const endDate = new Date('2023-05-05'); const diffInTime = startDate - endDate const diffInDays = diffInTime / (1000 * 3600 * 24); return `${year}年${month}月${day}日 ${hour}时${minute}分` } return ( <div> <DatePicker onConfirm={handleConfirm} /> </div> ) } 每年的立春，惊蛰，清明，立夏，芒种，小暑，立秋，白露，寒露，立冬，大雪，小寒，这十二节气的阳历日期都不是固定某一个日期，例如立春，有时是阳历2月4日，有时是阳历2月5日。 使用react、es6语法和Hook修改以上代码，使变量endDate里的固定日期改为与startDate接近的上个月节气、当月节气和下个月节气。
05-24
以下是修改后的代码： ``` import React, { useState } from 'react'; import DatePicker from 'react-mobile-datepicker'; import calendar from 'chinese-calendar'; const j = ['立春', '惊蛰', '清明', '立夏', '芒种', '小暑', '立秋', '白露', '寒露', '立冬', '大雪', '小寒']; const News = () => { const [endDate, setEndDate] = useState(new Date()); const handleConfirm = (date) => { const year = date.getFullYear(); const month = date.getMonth() + 1; const day = date.getDate(); const hour = date.getHours(); const minute = date.getMinutes(); const lunarDate = calendar.solar2lunar(year, month, day); const lunarMonth = lunarDate.lMonth; // 获取上个月、当月和下个月的节气 const prevJieQi = j[(lunarMonth + 10) % 12]; const currJieQi = j[lunarMonth % 12]; const nextJieQi = j[(lunarMonth + 2) % 12]; // 计算距离上个月、当月和下个月节气最近的日期 const prevJieQiDate = calendar.getPrevJieQi(year, prevJieQi); const currJieQiDate = calendar.getThisJieQi(year, currJieQi); const nextJieQiDate = calendar.getNextJieQi(year, nextJieQi); // 找到日期最接近的节气 let closestJieQiDate = prevJieQiDate; let diffInTime = date - prevJieQiDate; if (nextJieQiDate - date < diffInTime) { closestJieQiDate = nextJieQiDate; diffInTime = nextJieQiDate - date; } if (currJieQiDate - date < diffInTime) { closestJieQiDate = currJieQiDate; } setEndDate(closestJieQiDate); } return ( <div> <DatePicker value={endDate} onConfirm={handleConfirm} /> </div> ); } ``` 修改的思路： 1. 使用 `useState` Hook 定义 `endDate` 状态； 2. 在 `handleConfirm` 函数中，先计算当前选择的日期对应的农历日期，并获取当前月份的节气； 3. 然后通过 `calendar` 库提供的方法获取上个月、当月和下个月的节气日期； 4. 最后找到离当前选择日期最接近的节气日期，将其设为新的 `endDate` 值； 5. 在 `DatePicker` 中使用 `value` 属性绑定 `endDate` 状态，并在确认日期时触发 `handleConfirm` 函数。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

xiangzhihong8

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值