![見出し画像](https://assets.st-note.com/production/uploads/images/119624853/rectangle_large_type_2_4220c4db6796e4d89368ba83e08ae3fd.png?width=1200)
はじめる Velo #08
Wix専門のWeb制作会社、合同会社アクトワンのVelo開発部です!
この度、『初心者でも楽しみながらVeloを始められる』をコンセプトに、『はじめる Velo』シリーズを公開することになりました!
コーディング未経験でも「やってみたい!」と思えるようなネタを提供したいと思います!
それでは第8回です!
目標
入力した2つの数値を掛けてテキストに表示させる。
ページ要素
パーツを追加 / 入力欄 / テキストを入力 から入力を2つ (input1、input2) 追加します。
![](https://assets.st-note.com/img/1697948635237-fGEm4DGhdc.png)
それぞれのプロパティパネルから onInput( ) をクリックしページにinput1_input( )、input2_input( ) イベントハンドラを追加します。
![](https://assets.st-note.com/img/1697950459763-Fg9s1cfJqS.png)
一方、テキストを3つ(text1、text2、text3)を追加し、text1 には「×」を、text2 には「=」、text3には「計算結果」を表示し、ページに並べます。
![](https://assets.st-note.com/img/1697948880316-fEYEy3PShs.png)
コード(input1 イベントハンドラ)
入力(input1) の値を数値化するために Number( ) 関数を使います。input2も同様です。取り出した数値をvalue1、value2に代入し、それらを掛けた結果を resultに代入します。テキスト(text3)に代入するため result を String( ) 関数で文字列化して代入しています。
コード(input2 イベントハンドラ)
input1と全く同じです。
![](https://assets.st-note.com/img/1697950610154-Ve8f5Wft2o.png)
プレビュー
普通の計算機能です。エラー処理を加えるとより使いやすくなります。
![](https://assets.st-note.com/img/1697950994389-Rt3lJs0rru.png)
Velo開発のご依頼はこちら
この記事が気に入ったらサポートをしてみませんか?