uniapp的相关知识(1)

1、hover-class:当有鼠标按下时,会切换对应的样式;也可以设置对应的变色时间。

2、selectable:设置text组件的文本是否可以进行复制。

3、with:当设置为80%时,表示宽占整个屏幕的80%。

4、border:1px solid red;表示一个为红色的边框。

5、navigator:跳转到某个页面,可以内嵌到文字和图片中。下面是示例:

javascript 复制代码
<view>
    <navigator url="/pages/my/my">跳转到我的界面</navigator>
</view>

6、{{ a }}:如果设置a=5则输出5不输出a。此为插值表达式,可以输入逻辑判断,下面是示例:

javascript 复制代码
<view>{{1<2 ? "123":"456"}}</view>
//此时是输出456

7、ref:可以使用数据驱动,更新对应的值,num1的值不更新,num2的值会每秒+1,下面是示例:

javascript 复制代码
<template>
  <view>{{num1}}</view>
  <view>{{num2}}</view>
</template>

<script setup>
import { ref } from "vue";

let num1 = 6;
setInterval(() => {
   num1++;
   console.log(num1);
 }, 1000);

let num2 = ref(10);
setInterval(() => {
  num2.value++;
  console.log(num2.value);
}, 1000);
</script>

8、取余:在进行重置循环的时候可以通过取余来设计,下面是示例:

javascript 复制代码
<script setup>
import{ref}from"vue";
const arrs=ref([
    "../../static/pic1.png"
    "../../static/pic2.png"
    "./../static/pic3.webp"
    "./../static/pic.jpg"
]);
const picurl =ref("../../static/pic1.png")
leti=0;
setInterval(()=>{
    i++;
    console.log(i);
    picurl.value=arrs.value[i%4]
.1000)
相关推荐
2501_9160137438 分钟前
HTTPS 抓包难点分析,从端口到工具的实战应对
网络协议·http·ios·小程序·https·uni-app·iphone
2501_915918413 小时前
uni-app 项目 iOS 上架效率优化 从工具选择到流程改进的实战经验
android·ios·小程序·uni-app·cocoa·iphone·webview
00后程序员张3 小时前
如何在不同 iOS 设备上测试和上架 uni-app 应用 实战全流程解析
android·ios·小程序·https·uni-app·iphone·webview
耶啵奶膘18 小时前
uni-app头像叠加显示
开发语言·javascript·uni-app
chéng ௹18 小时前
uniapp 封装uni.showToast提示
前端·javascript·uni-app
吴传逞19 小时前
记一次uniapp+nutui-uniapp搭建项目
uni-app
雪芽蓝域zzs21 小时前
uni-app倒计时公共组件 封装,倒计时组件
uni-app
2501_915918411 天前
iOS 开发全流程实战 基于 uni-app 的 iOS 应用开发、打包、测试与上架流程详解
android·ios·小程序·https·uni-app·iphone·webview
黑马源码库miui520861 天前
JAVA同城打车小程序APP打车顺风车滴滴车跑腿源码微信小程序打车源码
java·微信·微信小程序·小程序·uni-app
清风细雨_林木木1 天前
uni-app 和 uni-app x 的区别
uni-app