uniapp的相关知识(1)
1、hover-class:当有鼠标按下时,会切换对应的样式;也可以设置对应的变色时间。
2、selectable:设置text组件的文本是否可以进行复制。
3、with:当设置为80%时,表示宽占整个屏幕的80%。
4、border:1px solid red;表示一个为红色的边框。
5、navigator:跳转到某个页面,可以内嵌到文字和图片中。下面是示例:
<view><navigator url="/pages/my/my">跳转到我的界面</navigator>
</view>
6、{{ a }}:如果设置a=5则输出5不输出a。此为插值表达式,可以输入逻辑判断,下面是示例:
<view>{{1<2 ? "123":"456"}}</view>
//此时是输出456
7、ref:可以使用数据驱动,更新对应的值,num1的值不更新,num2的值会每秒+1,下面是示例:
<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、取余:在进行重置循环的时候可以通过取余来设计,下面是示例:
<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)