よく忘れるJavascriptの正規表現のメモ書き
日付を確認する正規表現を元によく使う表現をメモしておく
/^\d{4}\-\d{2}\-\d{2}$/
^
- 入力の先頭文字にマッチする
- /^A/はBACにはマッチしないが、ABCにはマッチする
\d
- 数字にマッチする
- [0-9]に相当する
{n}
- 直前の文字がn回出現するものにマッチする
- \d{4}は数字4が四回続くものにマッチする
$
- 入力の末尾にマッチする
これらの表現は以下の記事を参考にしました。
正規表現 - JavaScript | MDN https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Regular_Expressions
ここさえ見るようにすれば、十分かも…
Vue.jsとVueValidateのよく使う機能のメモ書き
Vue.js
代表的なオプション
el: 既存DOMにVueインスタンスをマウントする
- elを指定しないで$mountで new Vue().$mount(“#app”)のようにも書ける
methods
components
components: { searchForm }
のように設定すると
<search-form></search-form>
このように呼び出すことが出来る。
JS側はキャメルケースでもハイフンでも大丈夫だが、HTML側ではハイフン区切りで呼ぶ出す必要がある
代表的なディレクティブ
v-on
- イベントハンドリング
- v-on:inputのようにすると入力イベントを受け取る
- v-onとv-bindはよく使うので省略記法が用意されている
- v-on:clickは@clickと書ける
- イベント修飾子で@submit.prevent=“onSubmit"のように書くとSubmit時にリロードしない等できる
v-bind
- HTML属性をモデルの更新でリアルタイムに更新する
- v-bind:classはよく使う
- :classに省略して書ける
v-bind:selected
- :selectedで書ける
- selected=“{{ hoge == fuga }}"と書くと怒られる
- :selected=“hoge == fuga” とv-bindを使って{{}}は使わずに文字列で条件式を書くとうまくいく
v-model
- 双方向データバインディング用
- ビューの入力内容をモデルに反映、モデルの変更をビューに反映という使い方ができる
- v-model.trimのようにするとユーザーの入力を自動でトリムしてくれる
- 入力値をリアルタイムにバリデーションをかけたい時にもv-modelだと便利
- ユーザーの入力値をそのまま保存に使いたい時にも便利。本来はReactのように親コンポーネントに値を渡してstateを更新のような実装が状態管理としては良いんだけど、実装コストをかけずにサクッと作りたい時に良い。
v-cloak
<div v-cloak> {{ message }} </div>
v-for
- ループを回すのに使う
<option v-cloak v-for="data in list" :value="data.id" :key="data.id"> </option>
- 必ずユニーク値で:keyをつける
VueValidate
- $vにバリデーションデータが入っている
代表的なメソッド
- $touch
- $v.name.$touchのようにすると$dirtyフラグをtrueにする
- これによりエラー検知の対象になる
代表的なプロパティ
- $dirty
- 一度も触っていない場合はこのフラグはfalse
- 一度でも変更を加えるとtrueになる
- $error
- $v.name.$errorのように項目ごとにエラーフラグをとれる
- $dirtyがtrueになっていないと、このフラグが無視される
エラーメッセージを動的に出す
- 各バリデーションルールのフラグがとれるので、その値を見て用意したエラーメッセージを表示する
<span v-if="$v.title.$error && !$v.title.required"> タイトル名は必須です</span>
- コレクションデータの場合でも1つずつtouchする必要はなく、$v.array.$touch()だけでOK
IOS実機(開発中)のクラッシュを解析する手順
Firebaseでプッシュ通知を実装する時にIOSアプリ起動したらクラッシュすることがあったので、その解析手順。
クラッシュログの取得
- Window - Devises - view Device Logs
- 問題のクラッシュのログをコピーペースト
以下記事を参考にクラッシュログを解析する
- iOSのクラッシュログをSymbolicate(復元)して解析する - Qiita http://qiita.com/ruwatana/items/cc470eb229d267d693b0
ReactNativeでIOS/Android実機でプッシュ通知を試すハマり所まとめ(随時更新)
実機ビルドでハマる所(IOS)
- SigningでTeamでログインしていない
- error: Can’t find ‘node’ binary to build React Native bundle
- nodeのパスを設定
- Signing for XXX_Test
- Unable to resolve module immtable
- yarn add immutable
- React/RCTBundleURLProvider.h file not found
- node_modules削除して再yarn installやXcode再起動等で直ったりする
実機ビルドでハマる所(Android)
- gradle 3.3アップデートを求められる
- SDK Build Tools revision is too low
- 青いリンクからupdate
- JS bundle error
- index.android.js: Unexpected token )
- https://goo.gl/aECkmK
- 最新のreact-nativeのbabelの不具合
- gradleのsyncエラーはAndroid Studio再起動すると直ったりする
react-native linkは必要?
- project.pbxprojの内容がプッシュされていれば不要
プッシュ通知設定(IOS)
- Add the push notifications feature to your add id
- generalのbundle identifierが被っているのが原因
プッシュ通知の基礎知識
react-native-fcmを使うと実機起動時にcrashする
- resourcesフォルダにGoogleService-info-plistを移す
- これでもダメな場合
- pod ‘Firebase/Messaging’, ‘3.17.0’にして再度pod installする
- バージョン不整合で詰まる
- ここはまだ調査中
Androidの実機のログを見る方法
人事と労務の違いって?
最近、労務関係の仕事に触れる機会が多いです。 よく聞きはしますがイマイチよくわかっていなかったので、意味をまとめました。
人事と労務
人事も労務も会社の「人」に関わる業務。 人事は「社員個人」を対象としており、労務は「会社全体」を対象としている。
類似職種として「総務」があるが、これは社内の備品管理や社内環境整備、 社内イベントの企画などを行う職種。
人事の仕事
- 人員配置
- 採用
- 人材教育
- 評価制度の策定
労務の仕事
- 給与計算・勤怠管理
- 社会保険手続き
- 健康診断の対応
- その他福利厚生に関する手続き
人事も労務もひっくるめてHR(Human Resource)Techだなぁとか思ってましたが、 ちゃんと調べると様々な領域に分かれていて、とても興味深い。
ReactNativeの実機ビルドでunable to load script from assets index.android.bundleになる時の対処
以下手順でOK
mkdir android/app/src/main/assets react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res 再ビルド実行
[Android] Building release APK with react-native bundle
· Issue #2743 · facebook/react-native https://github.com/facebook/react-native/issues/2743
リリース用のAPKの時にJSファイルをbundleしてくれないgradleの不具合? 今の所、自分でbundleコマンドを実行しないといけないみたい。
自分の場合はこれで動きました。