Vueで画像アップロード + プレビュー機能付きフォームを作りました。(Base64エンコード利用) - Web備忘録

タイトルの通り、Vueで簡単な画像アップロードページを作ったので、JSFiddleで公開してみます。 今回はBase64エンコードを使って、画像を文字列情報として扱う方法を採用しています。 バックエンドとのやり取りをJSONベースで行っている場合は、この方法がシンプルで扱いやすいと思います。 VueImageForm - JSFiddle - Code Playground 挙動については上のリンクに飛んで触っていただければすぐにわかると思います。簡易的な画像アップロード機能と、画像送信前のプレビュー機能のついたフォームです。 ほしい方は勝手に使っていただいて大丈夫です。編集も自由です。変な所あったら勝手に直しちゃって下さい。（そしてこっそり教えて下さい。） 「なんでBase64エンコード使ったん？」という件については、一番最後の余談で書いたので、Vue興味ない方はそこまで飛ばして下さい！

[senahate]

参考に