🎴

NativeScript-Vueで文章入力フォームの高さ初期値を変える

2020/12/11に公開

背景

コメントを入力する欄をつくりたい。<TextField />(公式doc)を使っていたが、複数行になったときに拡大していく挙動に対応していないようなので<TextView />(公式doc)に切り替える。

問題

しかし<TextView />は初期の高さが6行もある。以下のGIFで、入力していくにつれどんどん拡大していく期待通りの挙動と、最初のボックスが6行もある期待はずれの見た目が確認できる:

最初は1行にしたいのだが、CSSで無理やりheight: 32;などとすると今度は入力に連れ拡大する挙動が失われてしまう。どうすれば…

解決

height: 32;ではなくmin-height: 32;にすればいいだけだった。次のようになる。

GitHubで編集を提案

Discussion