react-native-gifted-chatのtext inputのType a message...を変更する

※最後まで読んでください。

問題

react-native-gifted-chatのメッセージ入力欄のplaceholderはデフォルトで「Type a message...」となっているが、これを日本語表記に変更したい。

placeholder

環境

react-native-gifted-chat ^0.13.0

対処法

node_modules\react-native-gifted-chat\lib\InputToolbar.jsの76行あたり、 renderComposer()メソッドを修正する。最後にreturnされる<Composer>コンポーネントに、placeholderプロパティを追加する。

    renderComposer() {
        if (this.props.renderComposer) {
            return this.props.renderComposer(this.props);
        }
        // ↓デフォルトのコードはコメントアウトする
        // return <Composer {...this.props}/>;

        // 以下のように修正
        return <Composer {...this.props} placeholder={'ここにメッセージを入力してね'} />;
    }
プレイスホルダ

検索したキーワードは「giftedchat customize text input placeholder」で、以下記事が参考になりました。ありがとうございます。

Change send label and Type a message placeholder #356

最後

placeholderプロパティが公式で用意されていた。

<GiftedChat
    placeholder={'ここにメッセージを入力してね'}
/>