我使用react-native-zss-rich-text-editor开发了Rich Text编辑器,但工具栏操作不起作用,谁知道如何修复它?谢谢。以下是代码:
<RichTextToolbar
getEditor={() => this.richtext}
actions={defaultActions} // <= this actions does not work
iconTint='black'
selectedButtonStyle={{backgroundColor:'yellow'}}
/>
defaultTections在RichTextToolbar.js中定义:
const defaultActions = [
actions.insertImage,
actions.setBold,
actions.setItalic,
actions.insertBulletsList,
actions.insertOrderedList,
actions.insertLink
];
这也被定义为这里的常量:
export const actions = {
...
setBold: 'bold',
setItalic: 'italic',
...
insertImage: 'INST_IMAGE',
...
insertBulletsList: 'unorderedList',
insertOrderedList: 'orderedList',
insertLink: 'INST_LINK',
...
}
...这里切换案例:
switch(action) {
case actions.setBold:
case actions.setItalic:
case actions.insertBulletsList:
case actions.insertOrderedList:
case actions.insertImage:
this.state.editor.prepareInsert();
if(this.props.onPressAddImage) {
this.props.onPressAddImage();
}
break;
但是行动不起作用,请帮忙,我会很感激。谢谢。我正在使用Github的这个库:
您无需在RichTextToolbar中设置默认操作。我使用它而不使用任何默认操作。希望这对你有所帮助
<RichTextEditor
ref={(r)=>this.richtext = r}
style={{
alignItems:'center',
justifyContent: 'center',
backgroundColor: 'transparent',
width:screen.width/100*80,
height:screen.height/100*24,
}}
contentPlaceholder={'Type your post here...'}
hiddenTitle={true}
initialContentHTML={''}
editorInitializedCallback={() => this.onEditorInitialized()}
/>
<RichTextToolbar
getEditor={() => this.richtext}
onPressAddImage={()=>{
this.uploadImage();
}}
iconTint='black'
selectedButtonStyle={{backgroundColor:'#51671d'}}
/>
您需要从react-native zss-rich-text-editor导入“actions”
像这样:
import {RichTextEditor, RichTextToolbar, actions} from 'react-native-zss-rich-text-editor';
然后,在RichTextToolBar中,您只需设置如下操作:
actions={
[
actions.insertImage,
actions.setBold,
actions.setItalic,
actions.insertBulletsList,
]
}
完整的行动清单如下:https://github.com/wix/react-native-zss-rich-text-editor/blob/master/src/const.js