Question

我想将<button>转换为<Link>。但我不断收到错误。

Warning: Failed prop type: Invalid prop `to` supplied to `Link`.

我的代码看起来像这样。

import React from 'react';
import { Link } from 'react-router-dom';
import { auth } from '../firebase';

const SignOutButton = () =>
<button
  type="button"
  onClick={auth.doSignOut}
>
  Sign Out
</button>

export default SignOutButton

我想要这样的东西

import React from 'react';
import { Link } from 'react-router-dom';
import { auth } from '../firebase';

const SignOutButton = () =>
<Link
  to={auth.doSignOut}
>
  Sign Out
</Link>

export default SignOutButton

因为链接的样式不同而且只知道它为什么不起作用。

Answer 1

<Link>（来自react-router-dom）将to作为string，这是用户点击链接时重定向到的路径

to：string

要创建的链接位置的字符串表示形式通过连接位置的路径名，搜索和哈希属性。

或者对象：

to：object

可以具有以下任何属性的对象：

路径名：A   表示链接到的路径的字符串。

搜索：字符串   查询参数的表示。

哈希：放入网址的哈希，   例如＃一个哈希。

州：声明要保留到该位置。

你正在传递它auth.doSignOut，我猜这是一个函数，这反过来导致道具验证失败。

也许您只是在寻找a代码而不是路由器链接？

<a onClick={auth.doSignOut}>Sign Out</a>

React

1 个答案: