uniapp组件-uni-fav收藏按钮

官方示例：https://ext.dcloud.net.cn/plugin?id=864

效果图：

代码实现：

<template><view><uni-fav :checked="check" @click="favClick"/><uni-fav :checked="check" @click="favClick" :star="false" /><uni-fav :checked="check" @click="favClick" :circle="true" bg-color="red" bg-color-checked="blue" fg-color="yellow" fg-color-checked="white" /><uni-fav :checked="check" @click="favClick" :content-text="contentText" /><uni-nav-bar style="width: 100%;" :fixed="false" left-icon="arrowleft" title="标题" color="#333333" background-color="#FFFFFF"><block slot="right"><uni-fav :checked="check" :circle="true" @click="favClick" /></block></uni-nav-bar></view>
</template><script>
export default {components: {},data() {return {check: true,contentText: {contentDefault: '追番',contentFav: '已追番'}};},methods: {favClick() {this.check = !this.check;}}
};
</script>

uniapp组件-uni-fav收藏按钮相关推荐

uni-app里的拓展组件uni ui与UI框架uView UI的Popup 弹出层的区别！
uni-app里的拓展组件uni ui与UI框架uView UI的Popup 弹出层的区别! 文章目录 1.官网Popup 弹出层链接 2.属性不同 3.属性对照 4.弹出的方式 5.uView特有属 ...
uni-app 组件传值
uni-app中的组件之间的传值我们将compontents中的test文件作为子组件引入到index中使用引入并使用效果如下父传子首先我们在父组件中使用子组件的标签中去自定义title ...
uni-app关于uni.navigateTo的坑以及解决方案
我们在做的这个产品目前的结构是这样的,使用nvue编写的uni-app项目作为app端,使用vue编写的vue项目作为H5端.在app端一共有三个页面,分别为loading页面.setting页面.i ...
uni-app用uni.chooseImage API调用相机或从相册中选择图片
uni-app用uni.chooseImage API调用相机或从相册中选择图片 chooseImage: function() {var _this = this;uni.chooseImage({ ...
使用uni-app组件播放视频
目录一.简介二.前后端框架前端框架后端框架三.视频播放四.nginx部署 nginx命令五.后端打包六.代码地址一.简介想做一个简单的视频播放器,能够在局域网播放硬盘上的视频. 如 ...
uniapp使用uni.createInnerAudioContext()实现在app 小程序 h5有声书的播放
实现读书软件的听书功能,适配app,小程序,h5 实现效果展示功能带你包括: 章节,倒计时,上一章,下一章,播放,暂停,倍速: uniapp官方uni.createInnerAudioContext( ...
Ctrl+D 快捷键：浏览器 · 添加收藏按钮
Ctrl+D 快捷键:浏览器 · 添加收藏按钮快捷键: Ctrl + D 以上就是关于" Ctrl+D 快捷键:浏览器 · 添加收藏按钮"的全部内容.
修改vant 弹窗Dialog组件调用是确认按钮与取消按钮的文字
文章目录修改vant 弹窗Dialog组件调用是确认按钮与取消按钮的文字效果图 · 示例: 重要代码如下(部分): 代码使用 · 注意事项: 官方文档参数定义 · 注意事项: 文章阅读: 修改va ...
antd走马灯组件自定义前进后退按钮
antd走马灯组件自定义前进后退按钮[ts + react] antd的Carousel没有提供前进后退按钮需要自己根据文档实现此功能官方提供了next 和prev两个方法 next() 切换到下 ...
uni-app 微信小程序分享按钮
uni-app 微信小程序分享按钮官方文档说明在 manifest.json 的 App SDK 配置里,勾选微信消息及朋友圈,并填写相关 appkey,微信 appkey 在需要分享的页面填写: ...

uniapp组件-uni-fav收藏按钮

效果图：

代码实现：

uniapp组件-uni-fav收藏按钮相关推荐

最新文章

热门文章