当前位置：首页 > news >正文

新网站应该怎么做seo/域名注册商怎么查

news 2025/7/16 7:23:47

新网站应该怎么做seo,域名注册商怎么查,专门用来制作网页的软件是,做网站的意义大不大前言一、uniapp小程序收藏功能思路分析： 父组件引入子组件.并且父组件通过属性绑定向子组件传递数据子组件利用props来接收父组件传来的值，并且进行数据数据初始化赋值子组件利用属性绑定，根据当前的type值来显示已收藏还是未收藏点击收…

前言

一、uniapp小程序收藏功能

思路分析：

父组件引入子组件.并且父组件通过属性绑定向子组件传递数据
子组件利用props来接收父组件传来的值，并且进行数据数据初始化赋值
子组件利用属性绑定，根据当前的type值来显示已收藏还是未收藏
点击收藏，切换状态，并且调用更新数据接口
在更新数据接口里面，通过 uni.showLoading() uni.hideLoading() uni.showToast({
title:this.like?‘收藏成功’:‘取消收藏’,
icon:‘none’
})
来切换状态

1 父组件向子组件传值

<likes :item="item"></likes>

2 子组件接收到值，将数据初始化

props: {item: {type: Object,default () {return {}}}},data() {return {like: false};},watch: {item(newVal) {this.like = this.item.is_like}},created() {this.like = this.item.is_like},

子组件利用属性绑定，根据当前的type值来显示已收藏还是未收藏

<uni-icons size="20" color="#f07373" :type="like?'heart-filled':'heart'"></uni-icons>

点击收藏，切换状态，并且调用更新数据接口

methods: {likeTap() {this.like = !this.likethis.setUpdateLikes()console.log('收藏成功');},setUpdateLikes() {uni.showLoading()console.log(111)this.$api.update_like({user_id: '5e76254858d922004d6c9cdc',article_id: this.item._id}).then(res => {console.log(111)uni.hideLoading()console.log('是否', this.like)uni.showToast({title:this.like?'收藏成功':'取消收藏',icon:'none'})console.log(res);}).catch(()=>{uni.hideLoading()})}

完整收藏组件

<template><view class="icons" @click.stop="likeTap"><uni-icons size="20" color="#f07373" :type="like?'heart-filled':'heart'"></uni-icons></view>
</template><script>export default {props: {item: {type: Object,default () {return {}}}},data() {return {like: false};},watch: {item(newVal) {this.like = this.item.is_like}},created() {this.like = this.item.is_like},methods: {likeTap() {this.like = !this.likethis.setUpdateLikes()console.log('收藏成功');},setUpdateLikes() {uni.showLoading()console.log(111)this.$api.update_like({user_id: '5e76254858d922004d6c9cdc',article_id: this.item._id}).then(res => {console.log(111)uni.hideLoading()console.log('是否', this.like)uni.showToast({title:this.like?'收藏成功':'取消收藏',icon:'none'})console.log(res);}).catch(()=>{uni.hideLoading()})}}}
</script><style>.icons {position: absolute;right: 0;top: 0;display: flex;justify-content: center;align-items: center;width: 20px;height: 20px;}
</style>