electron+Vue.jsで内容をテキストファイルに書き出す方法

##やりたいこと
やりたいことは２点
・メモ帳アプリをelectron+Vue.jsで作成する。
・入力された内容をテキストで吐き出せるようにする。

##テキスト出力方法
ざっくり言うと２つの機能を使います。
・保存ダイアログ表示 → electron
・ファイル保存 → Node.js

以下サンプル。

top.vue

<template>
    <div>
　　　　 <!-- 書き出しボタン表示。 -->
        <headerVue 
            @out="out"
        />
　　　　 <!-- 入力画面表示。ここに表示されている内容を出力。 -->
        <div class="mainArea">
            <sideBarVue :list="memoList" />
            <textarea
                placeholder="本文を入力してください。"
                rows="20"
                v-model="message"
                class="textArea"
            />
        </div>
    </div>
</template>

<script>
import sideBarVue from "../components/sideBar.vue";
import headerVue from "../components/header.vue";
import { remote } from "electron";
import * as fs from "fs";

export default {
  methods: {
    //書きだしボタン押下
    out: function() {
      //保存ダイアログを表示
      //第一引数：表示するダイアログ。基本的には固定で良い。
      //第二引数：保存形式と画面表示する名称を指定。
      //第三引数：取得したファイル名を指定して、保存やキャンセルボタンを押下した際の処理を記載。
      remote.dialog.showSaveDialog(
        remote.getCurrentWindow(),
        {
          filters: [{ name: "Text File", extensions: ["txt"]},
                    { name: "All Files", extensions: ["*"]}],
        },
        (filename) => {
          if (filename) {
            //ファイルに保存
            //第一引数：保存する際のファイル名。
            //第二引数：保存する内容
            //第三引数：エラー内容を取得して、エラーが発生した際の処理を記載。
            fs.writeFile(filename, this.message, (err) => {
              if (err) {
                alert(err);
              }
            });
          }
        }
      );
    }