forked from mevulfmp3/web
parent
d42bb8b9b7
commit
807b3d145a
@ -0,0 +1,30 @@
|
|||||||
|
<template>
|
||||||
|
<br><br>
|
||||||
|
<slider v-model="price"></slider>
|
||||||
|
<van-popup v-model:show="show" :style="{ padding: '64px' }">你有一张优惠卷可以使用</van-popup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import {ref,watch} from "vue";
|
||||||
|
import { Slider,Popup } from 'vant'
|
||||||
|
|
||||||
|
const price = ref(0)
|
||||||
|
const show = ref(false)
|
||||||
|
|
||||||
|
watch(price, (val,oldVal) => {
|
||||||
|
if(val>70){
|
||||||
|
show.value = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
watch(price, (val,oldVal) => {
|
||||||
|
if(val<20){
|
||||||
|
show.value = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
@ -0,0 +1,53 @@
|
|||||||
|
<template>
|
||||||
|
<h1>{{ author.name }}有没有出过书:</h1>
|
||||||
|
<h2>{{ publishedBooksMessage }}</h2>
|
||||||
|
<cell-group v-for="item in author.books">{{ item }}</cell-group>
|
||||||
|
<cell-group inset>
|
||||||
|
<input :value="newbook" @blur="update" label="文本" placeholder="请输入书"/>
|
||||||
|
<button @click="submit">提交</button>
|
||||||
|
</cell-group>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import {reactive, ref, computed} from "vue"
|
||||||
|
import {CellGroup, Field, Button} from "vant"
|
||||||
|
|
||||||
|
const author = reactive({
|
||||||
|
name: 'John Doe',
|
||||||
|
books: []
|
||||||
|
})
|
||||||
|
|
||||||
|
const newbook = ref("")
|
||||||
|
|
||||||
|
// 一个计算属性 ref
|
||||||
|
let publishedBooksMessage = computed({
|
||||||
|
get: () => {
|
||||||
|
let a = author.books.length > 0 ? 'Yes' : 'No'
|
||||||
|
if (newbook.value != "") {
|
||||||
|
|
||||||
|
a += "还有一本新书:" + newbook.value
|
||||||
|
}
|
||||||
|
return a
|
||||||
|
},
|
||||||
|
set: (val) => {
|
||||||
|
author.books.push("这家伙走后门")
|
||||||
|
console.log(val)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const update = (e) => {
|
||||||
|
newbook.value = e.target.value
|
||||||
|
}
|
||||||
|
|
||||||
|
const submit = () => {
|
||||||
|
// author.books.push(value.value)
|
||||||
|
// author.books.push(newbook.value)
|
||||||
|
publishedBooksMessage.value = "ok"
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
Loading…
Reference in new issue