z_blog:2018:181018_ionic4_storage_crud

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

--- z_blog:2018:181018_ionic4_storage_crud [2018/10/19] – [NotesDetail Pageの実装] adash333
+++ z_blog:2018:181018_ionic4_storage_crud [2019/02/14] (現在) – [NotesDetail Pageの実装] adash333
@@ 行 10: / 行 10: @@
 https://github.com/joshuamorony/ionic-notepad
 ===== 開発環境 =====
+<code>
+Windows 8.1 Pro
+VisualStudioCode
+git version 2.16.1.windows.4
+Node v8.12.0
+npm 6.4.1
+Ionic (Ionic CLI) 4.2.0
+Ionic Framework @ionic/angular 4.0.0-beta.13
+</code>
 ===== Ionic4アプリの作成 =====
@@ 行 147: / 行 158: @@
 (変更後)
+{{:z_blog:2018:pasted:20181019-222959.png}}
+なぜか、リストの一部をクリックしても、Detailページに飛ばない。。。
+Ctrl+Shift+I でconsole画面を見てみると、どうやら、Detailページのhtmlにタイプミスがありそう。
+ここだったらしい。。。
+{{:z_blog:2018:pasted:20181019-223139.png}}
+<ion-textarea></ion-textarea>が、<ion-tetarea></ion-tetarea>になっていた。
+（VisualStudioCodeのテキスト補完を利用して写経しているので、最初をタイプミスすると、後半も自動的にタイプミスとなる。）
+直してみると、うまくいった。
+{{:z_blog:2018:pasted:20181019-224155.png}}
+書き込むだけで保存されるようである。
+しかし、4行目以上になると、変な風になってしまう。
+{{:z_blog:2018:pasted:20181019-224301.png}}
+これをなんとかするためには、detail.page.scss を以下のように変更する必要があるらしい。
+{{:z_blog:2018:pasted:20181019-225352.png}}
+今回は、これでよしとする。
+===== ソースコード =====
+https://github.com/adash333/ionic4-notepad
+===== Netlifyにデプロイしてスマホで確認 =====
+[[https://www.netlify.com/|Netlify]]にログインして、https://github.com/adash333/ionic4-notepadを選択して、以下の設定を行い、デプロイしたものを、自分のAndroidスマホで確認。
+<code>
+npm run build --prod
+www/
+</code>
+以下のように、なんとか、うまくいったようである。
+{{:z_blog:2018:pasted:20181019-232239.png}}
 ===== 参考リンク =====

z_blog/2018/181018_ionic4_storage_crud.1539954707.txt.gz · 最終更新: 2018/10/19 by adash333