質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

Q&A

1回答

1311閲覧

入力された絵文字の保存方法について【Nuxt+Laravel】

Tikka123456

総合スコア34

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

0グッド

0クリップ

投稿2021/11/28 04:02

vue-emoji-pickerというライブラリを使って絵文字入力を作りましたが、このままではブラウザを更新すると保存されないので保存をしたいです。
そこで質問なのですが、入力された絵文字の保存方法はどのようすればいいでしょうか?
例えば、axiosでLaravelにAPI通信してDBに保存するのか?、Vuexで保存して表示するのか?
教えていただきたいです。よろしくお願いします。

環境
Nuxtをフロント、LaravelをAPIで構成
"nuxt": "^2.15.7"
Laravel Framework 8.49.1

該当のコード

javascript

1<template> 2 <div> 3 <v-textarea 4 name="input-7-1" 5 filled 6 auto-grow 7 value="" 8 v-model="input" 9 ></v-textarea> 10 <emoji-picker @emoji="insert" :search="search"> 11 <div slot="emoji-picker" slot-scope="{ emojis, insert}"> 12 <div> 13 <div> 14 <input type="text" v-model="search"> 15 </div> 16 <div> 17 <div v-for="(emojiGroup, category) in emojis" :key="category"> 18 <h5>{{ category }}</h5> 19 <div> 20 <span 21 v-for="(emoji, emojiName) in emojiGroup" 22 :key="emojiName" 23 @click="insert(emoji)" 24 :title="emojiName" 25 >{{ emoji }}</span> 26 </div> 27 </div> 28 </div> 29 </div> 30 </div> 31 <div slot="emoji-invoker" slot-scope="{ events: { click: clickEvent } }" @click.stop="clickEvent"> 32 <v-btn type="button" @click="actioninput">リアクション</v-btn> 33 </div> 34 </emoji-picker> 35 36 </div> 37</template> 38 39<script> 40import EmojiPicker from 'vue-emoji-picker' 41 42export default { 43 data(){ 44 return { 45 input: '', 46 search: '', 47 } 48 }, 49 components: { 50 EmojiPicker, 51 }, 52 53 methods :{ 54 insert(emoji){ 55 this.input += emoji 56 } 57 // actioninput(){ 58 // this.$store.dispatch('insert', this.input); 59 // } 60 } 61}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

どちらでもいいです。

投稿2021/11/28 05:50

skys215

総合スコア910

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問