Reactjs 垃圾邮件机器人能否读取客户端呈现的内容？

我想用React.js对垃圾邮件机器人隐藏我的电子邮件链接。我的想法是将电子邮件链接放入一个

，只有当有人单击触发按钮（如下拉菜单）时才会呈现该链接。因此，它只是客户端呈现的（所以至少谷歌爬虫程序不能读取它）

此外，链接的组件（即下拉组件的子组件）将如下所示：

import React, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import './styles.scss';

const LinkEmail = ({ user, domain, tld }) => {
  const [finalLink, setFinalLink] = useState('');

  useEffect(() => {
    setFinalLink(`mailto:${user}@${domain}.${tld}`);
  }, []);

  return (
    <a
      href={finalLink}
      className='link-email'
      data-user={user}
      data-domain={domain}
      data-tld={tld}
    />
  );
}

LinkEmail.propTypes = {
  user: PropTypes.string.isRequired,
  domain: PropTypes.string.isRequired,
  tld: PropTypes.string.isRequired,
};

export default LinkEmail;

你觉得我的解决方案怎么样？这个防御计划对垃圾邮件机器人足够有效吗？我错过什么了吗？有什么我可以改进以增加保护吗

---

提前感谢

通用刮板可能不会“点击”UI中的每个按钮，因此可以工作，但它们可以获取所有属性值并将其解析为电子邮件（例如）

一个快速的解决方案是将模糊的电子邮件存储在属性中，并在单击时对其进行转换

您可以研究电子邮件混淆问题，但请记住，有许多观点和不同观点的文章：

---

不幸的是，如果刮板设计足够智能，任何东西都可以绕过

.link-email {
  &:before {
    content: attr(data-user) "@";
  }

  &:after {
    content: attr(data-domain) "." attr(data-tld);
  }
}