2

我目前是一个基于 preactJS 和 algolia 的小项目？我发现 reactjs 有 algolia 组件，但不幸的是，preactjs 没有 algolia 组件。这就是为什么我的问题是如何将 algolia javascript 文件包含到 preactjs 中？

<script src="https://cdn.jsdelivr.net/instantsearch.js/1/instantsearch.min.js"></script>
4

4 回答 4

4

Preact 有组件 Head。要安装它运行

yarn add preact-head

然后可以指定标准头元素，例如脚本、元等。例如 app.js

import Head from "preact-head";

export default class App extends Component {

        render() {
            return (
                <div id="app">
                    <Head>
                        <meta name="Whatever" />
                        <script src="https://cdn.jsdelivr.net/instantsearch.js/1/instantsearch.min.js"></script>
                    </Head>

                </div>
            );
        }
    }
于 2018-04-06T13:28:54.407 回答
2

您可以动态插入脚本，试试这个：

componentWillMount() {
    const script = document.createElement("script");
    script.src = "https://cdn.jsdelivr.net/instantsearch.js/1/instantsearch.min.js";
    script.async = true;

    script.onload = function() {
       // init your algolia code here
    }

    document.body.appendChild(script);
},
于 2017-08-16T08:52:23.043 回答
0

您可以将它添加到您的 index.html 中的 head 标签之间。在 React 中，index.htmlpublic/index.html 在 Preact 中，index.html 在src/index.html

<head>
<script src="https://cdn.jsdelivr.net/instantsearch.js/1/instantsearch.min.js"></script>
</head>
于 2017-08-16T09:08:52.790 回答
0

您可以安装包algoliasearch（如果包不正确，只需在https://npmjs.com搜索所需的包）

现在，您可以npm install algoliasearch --save在 package.json 所在的根级别进行操作，并在模块中使用它，如下所示 -

import algolia from 'algolia';

然后在你的代码中使用它的方法。

于 2019-01-15T09:44:09.503 回答