2017-08-04 18 views
0

私はreact-native-zss-rich-text-editorを使用してリッチテキストエディタを開発しましたが、ツールバーのアクションは機能しません。ありがとうございました。ネイティブのzssリッチテキストエディタのツールバーアクションに反応しません

<RichTextToolbar 
getEditor={() => this.richtext} 
actions={defaultActions} // <= this actions does not work 
iconTint='black' 
selectedButtonStyle={{backgroundColor:'yellow'}} 
/> 

defaultActionsが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のからこのライブラリを使用してM:あなたはRichTextToolbarでデフォルトのアクションを設定する必要はありません

https://github.com/wix/react-native-zss-rich-text-editor

+0

あなたはそれを理解しましたか?あなたの答えを共有する心ですか? – chapeljuice

答えて

1

。私はデフォルトのアクションを使用せずにこれを使用しています。あなたは、あなたのRichTextToolBarで、その後

import {RichTextEditor, RichTextToolbar, actions} from 'react-native-zss-rich-text-editor'; 

:あなた

<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'}} 
/> 
0

このヘルプは、あなたがこのように反応し、ネイティブZSS-リッチテキストエディタを

から 'アクション' をインポートする必要がありホープ

actions={ 
       [ 
       actions.insertImage, 
       actions.setBold, 
       actions.setItalic, 
       actions.insertBulletsList, 
       ] 
      } 

アクションの完全なリストはここにあります:https://github.com/wix/react-native-zss-rich-text-editor/blob/master/src/const.js

関連する問題