javascript 将函数中的变量集导出到另一组件React

ehxuflar 于 2022-10-30 发布在 Java

关注(0)|答案(1)|浏览(144)

我在React应用程序的一个组件中的函数内设置了一些变量，需要在其他组件中重用这些变量。
我这样设置组件1中的变量（这是一个非常简化的版本，但捕捉到了结构）

export default function Example() {
                const [market, setMarket] = useState('');
        return ( 
<button onClick={setMarket('1')}>Click 1</button>
    <button onClick={setMarket('2')}>Click 2</button>
    <button onClick={setMarket('3')}>Click 3</button> )}

如何导出'market'变量，以便将其导入到另一个组件中（在单独的jsx文件中），并根据需要进行渲染。我知道可以导入整个组件，或者在组件1中的此函数之外设置一个变量并将其导出，但我不知道如何根据单击的按钮有条件地设置它。
谢谢你

JavaScript

来源：https://stackoverflow.com/questions/74246151/exporting-a-variable-set-in-a-function-to-another-component-react

1条答案

按热度按时间

jchrr9hc1#

在另一个组件中使用状态值有不同的方法。
1.第一个是props-创建一个传递如下值的组件-
==〉{ const [值，设置值] =使用状态（“”）返回（
）}的
而在第二个组件中，我们得到的值为-

const SecondComponent = ({value})=>{
return(
<div>
{value}
</div>
)
}

1.而第二种方法是使用state传递值，并通过另一个组件中的useLocation获取该值-
第一个组件，如-

const FirstComponent = () =>{
return(
<div>
<Link to="/secondpage" state={{value:yourValue/state}}>Click Here</Link>
</div>
)
}

第二个组件，如-

const Second Component = () => {
const {state} = useLocation()
return(
<div>{state}</div>
)
}

希望这些解决方案有助于解决你的问题。如果你仍然面临的问题让我知道，我会帮助你。谢谢

赞(0）回复(0）举报 2022-10-30

我来回答

javascript 将函数中的变量集导出到另一组件React

1条答案

相关问题

热门标签

最新问答