郵便番号から住所を自動入力するZipaddrxを任意のタイミングで動かす[Js,React]

javascript

郵便番号から住所を自動入力するZipaddrx

zipaddr.com

Jsを呼んでおけば勝手に動いてくれるんですがReactを使っていてonload以外のタイミングで動かしたくなったのでその時の対処法です。

任意のタイミングで初期化

Zip.x();

これだけ

ReactでZipaddrを使う方法

コンポーネントがマウントされたタイミング(componentDidUpdate)で Zip.x() を実行します。

~~~
  componentDidUpdate(prevProps, prevState) {
    Zip.x();
  },
~~~

これだけだとフォームの内容がstateに入っていないためフォームの内容を変更するとリセットされてしまいます。

住所が自動入力されたら住所をstateに入れる

郵便番号のフォーカスが外れたタイミングで都道府県、市区町村をstateに入れる関数を呼びます。

// View部分(郵便番号部分のみ)
<input onBlur={(e) => this.onBlurZipcode()} id="zip" onChange={(e) => this.props.onChangeValue('zipcode', e.target.value)} value={this.state.zipcode} />

// 郵便番号のフォーカスが外れたタイミングで都道府県、市区町村をstateに入れる
onBlurZipcode() {
  this.setState({ 
    pref: document.getElementById('pref').value,
    addr: document.getElementById('addr').value
  });
}

JavascriptのObjectをeachしたい

javascript

Javascriptでオブジェクトをeachで回したい時に
array同様にforEach使おうとしたらダメだった

ダメなパターン

obj.forEach(function (v,i) {
  console.log(i, ':', v);
});

普通にforを使うパターン

for (var key in obj) {
  if (obj.hasOwnProperty(key)) {
    console.log(key, ':', obj[key]);
  }
}

モダンぽい書き方

Object.keys(obj).forEach(function (key) {
  console.log(key, ':', obj[key]);
});

Rubyの多重代入　,(カンマ)で区切られた代入の挙動

Ruby

こんなやつが出てきて挙動が分からず困っていたら多重代入というやつらしい。

a, b = Hoge.moge

多重代入についてまとめます。

左辺が1つで右辺が複数の場合

配列に変換される

a = 1, 2 #=> [1, 2]
a #=> [1, 2]

左辺、右辺ともに2つの場合

左辺の各変数に右辺の各要素が代入される

a, b = 1, 2 #=> [1, 2]
a #=> 1
b #=> 2

左辺の数が多い場合

左辺の残りにnilが代入される

a, b = 1 #=> 1
a #=> 1
b #=> nil

右辺の数が多い場合

余った要素は無視される

a, b = 1, 2, 3 #=> [1, 2, 3]
a #=> 1
b #=> 2

他にも色んなパターンや使い方があるみたいですがこのへんで。。。

herokuでworkerだけをrestartする方法

Heroku

heroku ps -a myapp

まずはプロセスを確認

$ heroku ps -a myapp
=== web (Standard-1X): bundle exec puma -C config/puma.rb (1)
web.1: up 2017/03/06 00:00:00 +0900 (~ 10h ago)

=== worker (Standard-1X): bundle exec sidekiq -C config/sidekiq.yml (1)
worker.1: up 2017/03/06 00:00:00 +0900 (~ 10h ago)

heroku restart worker.1 -a myapp

プロセスを指定して再起動

$ heroku restart worker.1 -a myapp
Restarting worker.1 dynos on ⬢ myapp... done

複数のworkerを同時に再起動する方法

$ heroku ps -a myapp
=== web (Standard-1X): bundle exec puma -C config/puma.rb (1)
web.1: up 2017/03/06 00:00:00 +0900 (~ 10h ago)

=== worker (Standard-1X): bundle exec sidekiq -C config/sidekiq.yml (3)
worker.1: up 2017/03/06 00:00:00 +0900 (~ 10h ago)
worker.2: up 2017/03/06 00:00:00 +0900 (~ 10h ago)
worker.3: up 2017/03/06 00:00:00 +0900 (~ 10h ago)

複数workerがある場合、下記のようにすれば一括で再起動。

$ heroku restart worker -a myapp
Restarting worker dynos on ⬢ myapp... done