text表示文本
image.png

image.png

image.png
在一行显示了,这和我们web开发中的span标签很像
image.png
view元素就相当于我们web开发中的div标签,是一个块级元素,会占据我们的一整行。
image.png
俩view
image.png

localhost:8080/#/pages/index/index
375
x667
wi
uni-app
uni-app
vuc

image.png
image.png
text最终编译出来就是span标签
image.png

官方查看基础组件有哪些

https://uniapp.dcloud.io/component/view.html
image.png
image.png
给这个view加上hover-class属性
image.png
image.png
按下鼠标的时候
image.png

scroll-view

image.png
快捷点
image.png
scroll-y 表示可以垂直的滚动。
image.png

image.png
没有生效,因为会把整体的高度撑开。
image.png
我们的scroll-view需要给它指定一个高度。

image.png
给他设置一个类名
image.png
image.png
image.png
可以正常的上下滚动
image.png

还有很多其他的属性
image.png
image.png
可以监听事件
image.png

事件

image.png

image.png

滚动输出
image.png
image.png

表单组件

image.png

image.png
image.png

image.png
image.png
加上冒号,绑定值
image.png
也可以用双向绑定
image.png

image.png
点击按钮
image.png
输入123,下面的值同样会改变
image.png

结束