115 lines
3.8 KiB
Vue
115 lines
3.8 KiB
Vue
<template>
|
|
<view class="page">
|
|
<view class='wraper'>
|
|
<view class='header'>
|
|
<view class="header-item">哈哈</view>
|
|
<view class="header-item">哈哈</view>
|
|
<view class="header-item">哈哈</view>
|
|
<view class="header-item">哈哈</view>
|
|
<view class="header-item">哈哈</view>
|
|
<view class="header-item">哈哈</view>
|
|
</view>
|
|
<view class='main'>
|
|
<view class="main-left">
|
|
</view>
|
|
<view class="main-right">
|
|
<scroll-view class='main-scroll' scroll-y style="height: 100%">
|
|
<view class='list-box'>
|
|
<view class='list-item' v-for="(item,index) in data.cardList">
|
|
<view class='list-item-left'>
|
|
<image class="list-item-img" src="../../static/logo.png"></image>
|
|
</view>
|
|
<view class='list-item-right'>
|
|
<text class="list-item-title">{{item.name}}</text>
|
|
<view class='list-item-content'>{{item.content}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
<view class='footer'>footer</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
onLoad,
|
|
onShow,
|
|
} from "@dcloudio/uni-app";
|
|
import useCounter from '../../composables/counter'
|
|
import {
|
|
ref,
|
|
reactive,
|
|
computed,
|
|
watch
|
|
} from 'vue'
|
|
const data = reactive({
|
|
a: 1,
|
|
b: 2,
|
|
windowHeight: 0,
|
|
name: "jack",
|
|
cardList: [{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},{
|
|
name: '最灵繁的人也看不见自己的背脊脊脊脊脊脊脊脊。',
|
|
content: '一切利己的生活，都是非理性的，动物的生活。 —— 列夫·托尔斯泰'
|
|
},]
|
|
})
|
|
|
|
uni.getSystemInfo({
|
|
success: res => {
|
|
console.log(res)
|
|
data.a = res
|
|
}
|
|
})
|
|
watch(data, (newValue, oldValue) => {
|
|
console.log('v1====', newValue, oldValue);
|
|
})
|
|
onLoad((options) => {
|
|
console.log('页面初始化')
|
|
});
|
|
onShow(() => {
|
|
console.log('页面出现时')
|
|
});
|
|
uni.getSystemInfo({
|
|
success(r) {
|
|
data.b = r
|
|
}
|
|
})
|
|
console.log(data.a)
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|