首页 > web前端 > 前端问答 > react怎么取消右键

react怎么取消右键

藏色散人
发布: 2023-01-04 16:46:44
原创
2252 人浏览过

react取消右键的方法:1、打开相应的react文件;2、通过添加代码“componentDidMount(){document.oncontextmenu = function (e) {e = e || window.event;return false;};}”来实现屏蔽浏览器默认右键事件即可。

react怎么取消右键

本教程操作环境:Windows10系统、react18.0.0版、Dell G3电脑。

react怎么取消右键?

react页面中屏蔽浏览器默认右键事件

componentDidMount() {
    document.oncontextmenu = function (e) {/*屏蔽浏览器默认右键事件*/
        e = e || window.event;
        return false;
    };
}
登录后复制

相关拓展:

React componentDidMount() 方法

React 组件生命周期 React 组件生命周期

componentDidMount() 方法格式如下:

componentDidMount()
登录后复制

componentDidMount() 方法在组件挂载后(插入 DOM 树中)立即调用。

依赖于 DOM 节点的初始化应该放在 componentDidMount() 方法中。

以下实例会先输出 runoob,然后使用 componentDidMount() 方法设置在组件挂载后输出 google:

实例

class Header extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favoritesite: "runoob"};
  }
  componentDidMount() {
    setTimeout(() => {
      this.setState({favoritesite: "google"})
    }, 1000)
  }
  render() {
    return (
      <h1>我喜欢的网站是 {this.state.favoritesite}</h1>
    );
  }
}
 
ReactDOM.render(<Header />, document.getElementById(&#39;root&#39;));
登录后复制

推荐学习:《react视频教程

以上是react怎么取消右键的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板