将 TinyMCE WYSIWYG HTML 编辑器集成到 React Native 应用程序

Question

I am trying to incorporate TinyMCE WYSIWYG HTML Editor into a react native WebView Component.我正在尝试将 TinyMCE WYSIWYG HTML Editor 合并到 React Native WebView 组件中。 Is there a way to perform this task?有没有办法执行这个任务？

Answer 1

I added Tinymce WYSIWYG editor inside react-native WebView component.My Webview Component looks like this:我在 react-native WebView 组件中添加了 Tinymce WYSIWYG 编辑器。我的 Webview 组件如下所示：

<WebView
 source={require("./WebView.html")}
 style={{width: Dwidth, height: Dheight}}
 onMessage={(event)=>{
 const x= event.nativeEvent.data;
 console.log("x: ",x);
 console.log("Type is: ",typeof(x));
 }}
/>

The corresponding WebView.html file:对应的 WebView.html 文件：

<head>
<style>
    body {
        padding: 5px;
    }
</style>
<script src="./tinymce.full.js?apiKey=<API_KEY>">

</script>

<script>
    tinymce.init({
        selector: '#mytextarea'
    });

    function manipulateForm() {
        var textContent = tinymce.activeEditor.getContent({format: 'raw'});
        manipulateFormNew(textContent);
    }

    function manipulateFormNew(textContent) {
        alert(textContent);
        window.postMessage(textContent);
    }
</script>
</head>
<body>
 <form name="myForm" onSubmit="return manipulateForm()" method="post">
  <textarea id="mytextarea">Please Share your thoughts here</textarea>
  <input type="submit" id="submit__button" value="Post Your Thoughts">
 </form>
</body>

Here the tinymce.full.js file contains the Tinymce JavaScript code.这里的 tinymce.full.js 文件包含 Tinymce JavaScript 代码。 Same directory also contains other Tinymce resources like skins, themes, style, etc files.同一目录还包含其他 Tinymce 资源，如皮肤、主题、样式等文件。

将 TinyMCE WYSIWYG HTML 编辑器集成到 React Native 应用程序

问题描述

1 个解决方案

解决方案1
3 2018-07-14 09:11:03

将 TinyMCE WYSIWYG HTML 编辑器集成到 React Native 应用程序

问题描述

1 个解决方案

解决方案1 3 2018-07-14 09:11:03

解决方案1
3 2018-07-14 09:11:03