REACT-NATIVE - abcjs - ReferenceError：找不到变量：元素

Question

import abcjs from 'abcjs';

export default class MusicScore extends Component {
    constructor(props) {
        super(props);
        this.state={
            data: this.props.navigation.getParam('abctune'),
        }
    }
    render(){
        data = this.state.data;
        renderScore = () => {
            abcjs.renderAbc('notation', data);
        }
        return(
            <WebView 
                source={
                    {html: `
                        <!DOCTYPE html>
                        <html lang="en">
                        <head>
                            <meta charset="UTF-8">
                            <meta name="viewport" content="width=device-width, initial-scale=1.0">
                            <title>Document</title>
                        </head>
                        <body>
                            <div id="notation"></div>
                        </body>
                        </html>
                    `}
                }
                domStorageEnabled
                javaScriptEnabled
                injectJavaScript={renderScore}
            />
        );
    }
}

The code above produces the following上面的代码产生以下内容

OUTPUT输出

dev enviornment:开发环境：

OS: Windows 10操作系统：Windows 10

node: v12.10.0节点：v12.10.0

Android Studio: 3.5.2安卓工作室：3.5.2

installed via package manager:通过包管理器安装：

npm install --save abcjs npm 安装 --save abcjs

Answer 1

Unfortunately, you need a DOM set up.不幸的是，您需要设置 DOM。 I haven't used react-native, so I'm not sure if this will work:我没有使用过 react-native，所以我不确定这是否有效：

What works for me when using a SSR package (like Nuxt) is to change the import to later in the process.使用 SSR 包（如 Nuxt）时对我有用的是将导入更改为稍后的过程。 So:所以：

mounted() {
  const abcjs = require('abcjs');
}

Is there something analogous in react-native? react-native 中有类似的东西吗？

REACT-NATIVE - abcjs - ReferenceError：找不到变量：元素

问题描述

1 个解决方案

解决方案1
0 2019-12-06 00:32:30

REACT-NATIVE - abcjs - ReferenceError：找不到变量：元素

问题描述

1 个解决方案

解决方案1 0 2019-12-06 00:32:30

解决方案1
0 2019-12-06 00:32:30