Question

我在Reactjs中使用Helmet在每页上提供我的元数据-可以正常工作，直到我想在标记中提供Schema标记。我正在按照文档中的描述进行实现，但是由于我的标记来自api，因此我需要转义代码以返回函数，我将收到此错误；

TypeError：tag [primaryAttributeKey] .toLowerCase不是函数

如果脚本只是页面上的一个字符串，那么脚本可以工作，但是当我调用该函数时，它会出错

这是我的代码；

async componentWillMount(){
        var data = await api.schema();
        this.setState({schema: data.data});
        console.log(this.state.schema);
    }


    getSchema(){
        if(this.state.schema.length){
            return this.state.schema.map((content,index) => {
                var pageschema = content.PageSchema;

                return(
                    pageschema
                );
            })
        }
    }

render() {
        return (

        <div>
            <Helmet>
                <meta charSet="utf-8" />
                <title>Title title title</title>
                <meta name="description" content="this is a page description"></meta>
                <link rel="canonical" href="xxx" />
                <script type="application/ld+json">{this.getSchema()}</script>
            </Helmet>
...

页面架构返回已进行JSON.parsed的以下内容

"@context": "https://schema.org",
"@type": "Organization",
"name": "xx",
"alternateName": "xx",
"url": "xx",
"logo": ""

有人有什么建议吗？

Answer 1

要正常工作，您需要先对数组进行字符串化处理，然后再发送Helmet：

getSchema(){
    const { schema } = this.state

    if(schema.length){
        return `${JSON.stringify(
            schema.map((content,index) => {
                const pageschema = content.PageSchema;

                return(
                    pageschema
                );
            })
        )}`
    }
}

无法使用头盔运行脚本标签获取Reactjs

1 个答案: