如何在reactJs中获取元值?

时间:2018-03-31 10:38:04

标签: reactjs

我正在研究react应用程序。我需要meta标签值(描述,标题等)。我无法访问它。我需要导航器共享api。我的代码是:

import React, { Component } from 'react';
import { Button } from 'semantic-ui-react'


class App extends Component {
  constructor(props){
    super(props);
    this.getOpenGraphData = this.getOpenGraphData.bind(this);
  }
  getOpenGraphData(property){
        return document.querySelector(`meta[property="${property}"]`)
            .getAttribute('content');
    }

  handleClick(){
    navigator.share({
      title: getOpenGraphData('og:title'),
      text: getOpenGraphData('og:description'),
      url: getOpenGraphData('og:url')
  })
  .then(() => {
    console.log('Successfully shared');
    alert("successfully shared")
})
  .catch((error) => console.log('Error sharing:', error));
  }

  render() {
    return (
      <div>
        <Button content='Click Here' onClick={this.handleClick.bind(this)}/>
      </div>
    );
  }
}

export default App;

但是我无法访问元属性。我在哪里做错了?

1 个答案:

答案 0 :(得分:0)

我认为问题不是选择元标记,而是使用 navigator.share(),因为它是所有浏览器都不完全支持的实验性功能,请检查here。< / p>

您可以在调用之前检查导航器是否受支持:

if (navigator.share) {
    navigator.share({...});
}