uni app 使用分段器之后如何动态自定义导航栏标题_uni-segmented-control items 动态-程序员宅基地
技术标签： uni app
1.在官网引用分段器 详细地址 https://ext.dcloud.net.cn/plugin?id=54 看会就明白
//分段器使用
<uni-segmented-control :current="current" :values="items.map(i=>i.title)" @clickItem="onClickItem" style-type="text"
active-color="#d9c917"></uni-segmented-control>
<view class="content">
<view v-show="current === 0">
<recommend></recommend>
</view>
<view v-show="current === 1">
<hot></hot>
</view>
<view v-show="current === 2">
<dynamic></dynamic>
</view>
</view>
2.组件引入
import uniSegmentedControl from "@/components/uni-segmented-control/uni-segmented-control.vue" //分段器组件
import dynamic from "@/components/active/dynamic.vue"
import recommend from "@/components/active/recommend.vue"
import hot from "@/components/active/hot.vue"
export default {
components: {
uniSegmentedControl,
dynamic,
recommend,
hot
},
data() {
return {
items: [{
title: "推荐"
}, {
title: "热门"
}, {
title: "活跃"
}],
current: 0,
params: {
}
}
},
methods: {
onClickItem(e) {
if (this.current !== e.currentIndex) {
this.current = e.currentIndex;
}
},
}
3 主要是用到2个知识点 watch监听 和动态设置导航栏标题uni.setNavigationBarTitle
监听current的变化 只要一改变就改变标题
watch: {
current: {
immediate: true,
handler(value) {
switch (value) {
case 0:
return uni.setNavigationBarTitle({
title: "推荐"
});
case 1:
return uni.setNavigationBarTitle({
title: "热门"
});
case 2:
return uni.setNavigationBarTitle({
title: "活跃"
});
}
}
}
}
4.最后看看效果
智能推荐
Android Studio真机调试教程_android studio 配置调试机-程序员宅基地
文章浏览阅读508次，点赞4次，收藏10次。进行USB连接的真机调试，将你写的安卓程序安装到安卓手机、平板。在目标安卓终端和AS进行一些设置。我的设备信息：Android设备：MatePad10.4 Mate40e版本：鸿蒙3.0 / 鸿蒙4.0 对应安卓下载10.0版本即可（只要是鸿蒙系统一般都是下载10.0）_android studio 配置调试机
get新技能！把学校饭卡复制到小米手环NFC版本上_nfc_reader_crack-程序员宅基地
文章浏览阅读7.8k次，点赞3次，收藏32次。*严正声明：本文仅限于技术讨论与分享，严禁用于非法途径。hello！大家好，欢迎来到网络安全情报局，网络安全特工将持续为您分享最新资讯、干货。也可以关注我的公众号：网络安全情报局，获取最新消息。一、NFC是什么？NFC是Near Field Communication缩写，即近距离无线通讯技术。由飞利浦公司和索尼公司共同开发的NFC是一种非接触式识别和互联技术，可以在移动设备、消费类电子产品、PC和智能控件工具间进行近距离无线通信。NFC功能提供了一种简单、触控式的解决方案，可以让消费者简单_nfc_reader_crack
[转]Discuz! X3.0最新研发进度【提前预览】_discuzx3.0-程序员宅基地
文章浏览阅读1.2k次。【Discuz! X3.0研发进度－曝光】1、离Discuz! X2.5发布已有半年时间，很多站长和我一样，想了解下Discuz!产品的最新动态，咱们研发团队最近都在忙什么呢？ 这段时间我们把主要精力放在了Discuz! 新产品的研发上了，在优化和完善Discuz! X2.5百项功能的基础上，开发Discuz! X3.0，目前Discuz! X3.0已进入最后攻坚阶段_discuzx3.0
DB2对SEQUENCE进行授权_db2 sequence授权-程序员宅基地
文章浏览阅读1k次。场景：在A模式下创建了序列TEST_SEQ,但是当B模式使用该序列时发现报错。此时就需要对B模式授权。具体步骤如下A模式下执行授权：grant usage on sequence igw.TEST_SEQ to ipay;B模式下创建别名：create or replace alias ipay.TEST_SEQ for sequence igw.TEST_SEQ这样模式A和B可以共用..._db2 sequence授权
qt5.9+vtk7.1.1+pcl1.8.1（使用qvtkWidget控件显示）_#include "qvtkwidget.h-程序员宅基地
文章浏览阅读571次，点赞3次，收藏3次。1.new file or project2.Qt Console A…3.add qvtkWidget.proSOURCES += \ main.cpp \ mainwindow.cppHEADERS += \ mainwindow.hFORMS += \ mainwindow.uiINCLUDEPATH += /usr/include/eigen3INCLUDEPATH += /usr/local/include/v_#include "qvtkwidget.h
UE5常用操作_ue5怎么隐藏摄像机-程序员宅基地
文章浏览阅读270次。使用ctrl+B跳转到对应object目录。_ue5怎么隐藏摄像机
随便推点
【机器学习】高斯回归过程GPR_高斯过程回归 kriging-程序员宅基地
文章浏览阅读418次。我是知识的搬运工_高斯过程回归 kriging
[Win32SDK基本]ListView Controls（1）Report (details) View 详解_syslistview32l 换行-程序员宅基地
文章浏览阅读7k次，点赞5次，收藏16次。本文由CSDN用户zuishiko所作，转载请注明出处：http://blog.csdn.net/zuishikonghuan/article/details/46872885老规矩，先上MSDN：https://msdn.microsoft.com/en-us/library/windows/desktop/bb774737(v=vs.85).aspx其实还是子窗口，static那节_syslistview32l 换行
QT 网络编程（一）-程序员宅基地
文章浏览阅读1.1k次，点赞38次，收藏20次。Qt 网络编程相关
软工视频总结-程序员宅基地
文章浏览阅读614次。经过十天的时间，对软工视频进行一下简单的总结。软工视频总共有24讲，一讲大约50分钟。前3章介绍软工视频的历史。 第 6 讲 1.需求分析的任务就是借助于当前系统的逻辑模型导出目标系统的逻辑模型，解决，目标系统的“做什么”的问题。 2.问题识别的另一项工作是建立分析所需要的通信途径，以保证能顺利地对问题进行分析。
python bad magic number_科学网-python反编译软件推荐uncompyle6-Bad magic number in .pyc-陈照强的博文...-程序员宅基地
文章浏览阅读2.6k次。背景从友方那边获得了pyc文件，但是由于他当时用的是python2.6编译的，而现在python2.6几乎被淘汰掉了，安装了python2.7 等其他版本无法运行该pyc文件，报错 RuntimeError: Bad magic number in .pyc file 。安装了python 2.6 后，运行该文件不报错，但是依赖模块openbabel，openbabel在python2.6中安装稍..._bad magic number in .pyc file
C语言中的数组（1）-程序员宅基地
文章浏览阅读902次，点赞29次，收藏17次。一维数组的创建和初始化，一维数组的使用，一维数组在内存中的存储，以及计算数组元素的个数的方法。