Vue.js : v-forはkeyが必要

Vue.jsの繰り返し構文v-forを以下のように書いたらエラーになりました。

<li v-for="(item, key) in items">

エラーメッセージはこんな感じ。

Elements in iteration expect to have 'v-bind:key' directives

どうやら、v-bind属性が必要のようです。こんな感じに修正したら動いてくれました。

<li v-for="(item, key, index) in items" v-bind:key="index">

XcodeからGitHubにアクセスするとリジェクトされる

Xcode(10.1)からGitHubにアクセスしたとき、

Authentication failed because the credentials were rejected

というエラーが発生しました。 ssh-keygenコマンドは以下のように実行しましたがこれが間違いだったようです。

$ ssh-keygen -t rsa

以下のように鍵を再作成したら、アクセスできるようになりました。PEMとして作成する必要があるようです。

$ ssh-keygen -t rsa -m PEM

macOS Mojaveで常に半角スペースを入力できるようにする

  1. Mac起動時にリンゴマークが出るまで「command + R」を押し続ける。

  2. 言語選択画面が出たら「日本語」を選択する。

  3. 画面が出たら、メニューの「ユーティリティ」→「ターミナル」を選択する。

  4. 以下のコマンドを入力し再起動する。

    $ csrutil disable
    $ reboot

  5. 通常通り起動するので、ターミナルを開き、まずは目的のディレクトリまで移動する。

    $ cd /System/Library/Input\ Methods/JapaneseIM.app/Contents/PlugIns/JapaneseIM.appex/Contents/Resources/

  6. KeySetting_Default.plistが編集ファイルなので、念の為バックアップを取っておく。

    $ cp KeySetting_Default.plist ~/

  7. vimでKeySetting_Default.plistを開く。

    $ sudo vim KeySetting_Default.plist

  8. 14行目の以下の記述を削除する。

    <string>contextual_space</string>

  9. 削除した場所に以下を追加する。

    <string>direct_input</string>
    <key>character</key>
    <string> </string>

  10. 同様に19行目を削除する。

    <string>contextual_space_reverse</string>

  11. 削除した場所に以下を記述する。

    <string>direct_input</string>
    <key>character</key>
    <string> </string>

  12. 以下のコマンドで設定を反映させる。そして動作確認。アルファベット入力/日本語入力関係なく、スペースを押すと半角スペース、シフト+スペースで全角スペースが入力できればOK。

    $ killall JapaneseIM

  13. 最初と同じように「command + R」で起動、ターミナルから以下のコマンドを実行する。

    $ csrutil enable
    $ reboot

Xcode6でUIWebViewを画面サイズぴったりで表示する

Xcode6でStory Boardを使ってUIWebViewを中央に配置しそのままのレイアウトで実行すると残念な感じになります。

f:id:chitans:20141214215704p:plain

上側はステータスバーに重なり、右側ははみ出し、下側は足りない...これを綺麗に画面に収まるようにします。

まずは、Constraintsの設定をします。下図のように上下左右にConstraintsを張り、上側だけ20(ステータスバーの分だけずらす)、その他は0に設定します。左右を −16に設定して調整する方法もありますが、長さがマイナスというのは気持ちが悪ので、ここではゼロに設定し、Add 4 Constraintsを押します。

f:id:chitans:20141214220421p:plain

これで実行してみます。

f:id:chitans:20141214220544p:plain

左右に16ピクセルのマージンが空いています。次はこの部分を調整します。

Document Outlineを開き、WebViewの下のConstraintsを開きます。

f:id:chitans:20141214221050p:plain

「Horizontal Space - View - Web View」を選択し、Attributes Inspectorを表示し、「 First Item」の「Relative to margin」のチェックを外します。

f:id:chitans:20141214221239p:plain

同様に、「Horizontal Space - Web View - View」を選択し、「Second Item」「のRelative to margin」のチェックを外します。

f:id:chitans:20141214221731p:plain

そして、実行すると、UIWebViewの上下左右が画面サイズぴったりになります。

f:id:chitans:20141214221456p:plain

ちなみにUIWebViewにAppleのサイトを表示するコードはこんな感じです。

- (void)viewDidLoad {
    [super viewDidLoad];
    NSURL *url = [NSURL URLWithString:@"http://www.apple.com/"];
    NSURLRequest *urlReq = [NSURLRequest requestWithURL:url];
    [_webview loadRequest:urlReq];
}

はじめてのおかいもの(Github Shop編)

世界的に有名なGithubマスコットキャラクター「オクトキャット」。そのフィギアをGithub Shopで購入した話。

購入の前に準備するもの
  1. PayPalアカウント
  2. 物欲
  3. Google翻訳
PayPalへ英語表記住所の登録

Github Shopはサンフランシスコにあります。日本語の住所では届きませんので、PayPalのページから英語表記の住所を登録します。参考にしたのはこのページ。

PayPal(日本語) - ペイパル|サポート|よくあるご質問|ローマ字で住所を登録するには

さすがPayPalの公式FAQ。キャプチャが付いていて分かりやすい。住所の英語表記はこちらのページを参考にしました。

比較的楽チンですが、後ほど問題が発生します。

Github Shopでおかいもの(2014/11/24 23:40)

Github Shopで欲しいものをカートの中に入れて購入手続きを進めます。途中支払い方法を聞いてきますので、PayPalを選んで支払いを完了します。支払いを完了すると、すぐにGithub Shopから確認メールが届きます。

Thank you for placing your order with GitHub!
This email is to confirm your recent order.
[ここに送り先と支払情報]
1x Octocat Mug - White for $14.00 each
1x 3" GitHub Circle Stickers - 10 Count for $2.00 each
1x Die Cut GitHub Stickers - 10 Pack 3" for $2.00 each
1x 5" Octocat Figurine - Octocat Figurine for $40.00 each
Subtotal : $58.00 USD
Shipping : $29.12 USD
Total : $87.12 USD

送料高っ!

送料高っ!

大切なことなので2回言いました。国際便なので当然ですが、割と高いので周りに購入する方がいるときは、共同購入をお勧めします。送り先住所が英語表記になっているので一安心。さらに1分後にPayPalからも確認メールが届きました。

xx xx様
GitHub, Inc.への$87.12 USDのお支払いが完了しました
[ここに支払い情報]

日本語のメールが届いたけど、配送先住所が英語表記になっているのでまぁ大丈夫かなと。とりあえずこれで発注処理は完了です。

Github Shopからなにやらメールが...(2014/11/26 05:58)

Hi xx xx,
Sorry for the inconvenience, but can you please provide your name in english characters.
The US Postal Service requires that we submit names and addresses in english characters.
Thanks!
GitHub

!!!

意訳すると、「名前は英語で書いてね(はあと)」ということです。PayPalのページでは名前を変えるのが面倒そうだったのでそのままにして、マーチャントメッセージ欄(お店へのメッセージ欄)に英語表記の名前を書いておいたのですが、うまく伝わらなかったようです。そこで稚拙な英語力で4〜5行ほどの文章を作成し、メールで返信しました。

Github Shopから返信メールが来ました(2014/11/27 02:19)

Hi xx xx,
I have updated the shipping address on your order. When your order is shipped, you should receive a tracking notification to follow your shipment's progress.
Cheers!
GitHub Shop

うまく伝わったようです。時差を考えればここまでの対応は割とスピーディな方だと思います。

発送通知とトラッキング情報が来ました(2014/11/27 11:01)

Hi xx xx,
All of the items from order #999999 have now been shipped:
1x Octocat Mug - White
1x 3" GitHub Circle Stickers - 10 Count
1x Die Cut GitHub Stickers - 10 Pack 3"
1x 5" Octocat Figurine - Octocat Figurine
They are being shipped via USPS to the following address:
[ここに送付先住所]
The tracking number for these items is LN999999999US.
You can see the status of this shipment at the following URL:
https://tools.usps.com/go/TrackConfirmAction_input?origTrackNum=LN999999999US
NOTE: Please allow 24 hours for the status of the shipment to correctly display on the USPS status website. The USPS has been known to reuse old tracking numbers from previous shipments dating back a couple of years.
Thank you for ordering from GitHub!

無事発送されたようです。メール記載のURLにアクセスすると、荷物がどこにあるのかを教えてくれます。

(2014/11/29 03:33)Accepted at USPS Origin Sort Facility Location:SAN FRANCISCO

(2014/11/29 04:48)Arrived at USPS Origin Facility Location:SAN FRANCISCO

(2014/11/29 08:14)Departed USPS Facility Location:SAN FRANCISCO

(2014/12/08 ??:??)手元に到着

ラッキング情報が少なく、ちゃんと記録されているのか良くわかりませんが、とりあえず届きました。

f:id:chitans:20141208225346j:plain

f:id:chitans:20141208225242j:plain

書評:作ればわかる!Titanium Mobileプログラミング

久しぶり(2年ぶり?)にTitanium Mobile本が出ましたので、早速手に入れました。応援の意味も込め、感想を書いてみます。

導入部分が分かりやすい

アプリ作成に必要なツールの紹介と入手先、インストール方法等はもちろん、Titanium Mobileの裏側の動きも簡潔に書いてあります。特に

  1. Titaniumの読み方は、「たいたにうむ」
  2. JavaScriptJavaObjective-Cに変換されるのではなくて、JavaScriptインタプリタによってJavaScriptが実行されている
  3. どうせ遅くて使い物にならないんでしょ?⇒そんなことはない

の3点は、世の中的に誤解されていることが多いので、キチッと書かれていて良かったです。

最近の話題が散りばめられている

iOSアプリはObjective-CSwiftで書く必要がある」という記述にはびっくりしましたが、ListViewやModules.Mapを取り扱っており、新しさ感があります。もちろんAlloyACSも入っています。

JavaScriptの説明が簡潔

JavaScriptの説明部分は、詳しく書けばどこまでも書けるのですが、とりあえずTitanium Mobileアプリに必要なものだけを書いてある印象で、良い意味で簡潔です。

ということで、、、

久々のTitanium本です! 説明も分かりやすく、画面キャプチャも多めに入っていますので、初心者の方やTitanium Mobileに最近触ってなかった方には非常に良い本だと思います。