view

视图容器。

它类似于传统html中的div，用于包裹各种元素内容。

如果使用nvue，则需注意，包裹文字应该使用组件。

属性说明

属性名	类型	默认值	说明
hover-class	String	none	指定按下去的样式类。当 hover-class=“none” 时，没有点击态效果
hover-stop-propagation	Boolean	false	指定是否阻止本节点的祖先节点出现点击态
hover-start-time	Number	50	按住后多久出现点击态，单位毫秒
hover-stay-time	Number	400	手指松开后点击态保留时间，单位毫秒

如果使用 <div> ，编译时会被转换为 <view>

text

文本组件。

用于包裹文本内容。

属性说明

属性名	类型	默认值	说明	平台差异说明
selectable	Boolean	false	文本是否可选
space	String		显示连续空格	App、H5、微信小程序
decode	Boolean	false	是否解码 App、H5、微信小程序

space 值说明

值	说明
ensp	中文字符空格一半大小
emsp	中文字符空格大小
nbsp	根据字体设置的空格大小

注意

<text> 组件内只支持嵌套 <text>，不支持其它组件或自定义组件，否则会引发在不同平台的渲染差异。
在app-nvue下，只有<text>才能包裹文本内容。无法在<view>组件包裹文本。
decode 可以解析的有   < > & ' &ensp; &emsp;。各个操作系统的空格标准并不一致。
除了文本节点以外的其他节点都无法长按选中。
支持 \n 方式换行。
如果使用 <span> 组件编译时会被转换为 <text>。

代码示例：

<template><view><view class="view-box animated" hover-stay-time="1000" hover-class="view-box-hover rubberBand">view组件演示</view><text :selectable="true">text组件\n第&nbsp;二&nbsp;行</text></view>
</template><script>export default {data() {return {//title: 'Hello'}},onLoad() {},methods: {}}
</script><style>.view-box{width: 200upx;height:200upx;background:#09BB07;color: #FFFFFF;margin: 100upx;}.view-box-hover{background: red;}
</style>

uni-app中view和text组件和动画的使用相关推荐

uni app中使用图表
关于在uni app中运用图表今天写项目,需要在uni app中使用图表,我使用的是ucharts. 具体操作如下 1.下载 ucharts可以直接在uni app的插件市场下载安装. 先在插件市场 ...
vue插槽solt ，uni.app
一.什么是插槽? 插槽就是子组件提供给父组件使用的一个占位符,用<slot></solt>表示父组件可以在这个占位符中填充任何模板代码. 二.插槽的用法 1.创建一个子组件,在 ...
React Native TEXT 组件文字显示不全异常解决（小米文字显示不全：小米10 ,Redmi k30出现）
开发中发现一处text组件显示文字,总是丢末尾几个字符的异常.就很疑惑,拿小米11ultra(12.0.9)和小米8(12.0.3)测试正常,小米10(miui12.0.11)和redmi k30会 ...
Android uni app 列表底部白条解决方案
uni app中android打开本地vue的列表会发现,底部有条白边. vue通过uni.getSystemInfoSync();方法获取系统信息,首次取值对,再次取值就出错 uni app每次启动 ...
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )
文章目录 ◯.AnimatedBuilder 引入一.创建动画控制器二.创建动画三.创建动画作用的组件四.创建 AnimatedBuilder 关联动画与组件五.动画运行六.完整代码示例 ...
uni 在app中引入h5页面（uni编写）
关于在app中引入网页,使用的webview标签相对于uniapp 官网给出的webview使用方法在这里https://uniapp.dcloud.io/component/web-view 但是 ...
MFC中的MainFrame Dlg,App,Doc,View的关系
MFC中的MainFrame Dlg,App,Doc,View的关系 MainFrame: 主框架类 Dlg 是Dialog 的缩写,表示对话框本身 App类就是这个SDI作为"程序&quo ...
uni开发中可以用table标签么_「uni-app 组件」t-table 表格
table 表格基本使用组件,让你制作简单表格只需要专注内容,而不用过度专注样式. 此组件基本全平台支持.(支付宝,百度,头条小程序理论上都支持,但是没有很细致的测试这几个平台) 功能亮点自定义全局 ...
uni-app中view组件的基本使用
view视图容器组件的用法 View 视图容器, 类似于 HTML 中的 div 001 - 组件的属性 002 - 代码案例 <view class="box2" hove ...
Unity中Text组件段首如何缩进两个字符
Unity中Text组件段首如何缩进两个字符我们在使用Unity的Text组件时,如果想实现段首缩进两个字符的功能,一般情况下会想到添加空格的字符如"\0\0",来实现,但是应该 ...

uni-app中view和text组件和动画的使用

uni-app修炼之路（七）

view

text

uni-app中view和text组件和动画的使用相关推荐

最新文章

热门文章