2022.12.29（木） / 10:04
今日の支出合計算出アプリ、SPA
- ID
- 9316
- Published
- 2022-12-29 10:04
- Modified
- 2025-08-11 14:03
- Author
- khiro
- Categories
- デフォルト
- Tags
- Vue.js
Vue.jsで、支出を記録して「記録」ボタンを押すと、今日の支出合計が自動計算されるアプリを作成してみました。
See the Pen Vue3 支出管理アプリ by Shibata Hiroki (@khiro-enginner) on CodePen.
使い方
例えば、コンビニで88円の水を買ったとすると、入力欄に88と入力して、「記録」ボタンを押します。そうすると、今日の支出合計が計算されて、表示されます。
次に、スーパーで夕食の材料を買いに行き、合計777円使ったとします。同じ操作を行うと「今日の支出合計」が計算されて表示されていることが分かります。
注意点
SPA（Single Page Application）なので、ブラウザをリロードしてしまうと、データが消えてしまいます。