react中useState的作用是什么

本文小编为大家详细介绍“react中useState的作用是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“react中useState的作用是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

我们提供的服务有:成都网站设计、做网站、微信公众号开发、网站优化、网站认证、余杭ssl等。为1000+企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的余杭网站制作公司

useState

useState 通过在函数组件里调用它来给组件添加一些内部 state。React 会在重复渲染时保留这个 state。useState
会返回一对值:当前状态和一个让你更新它的函数,你可以在事件处理函数中或其他一些地方调用这个函数。它类似 class 组件的
this.setState,但是它不会把新的 state 和旧的 state 进行合并。

接下来通过一个示例来看看怎么使用 useState。

有这么一个需求:需要在 iframe 中加载外部网页

初始的代码我们通过 函数式组件 来实现这个需求,只需要简单的渲染一个 iframe

import React, { useState } from 'react';

import styles from './index.less';

function Link(props) {
  const { match: { params: { link = '' } = {} } = {} } = props;
  const enCodeUrl = decodeURIComponent(link);
  const url = enCodeUrl.startsWith('http') ? enCodeUrl : `http://${enCodeUrl}`;
  return (