uniapp中使用mixins(混入)使用

mixins 选项接收一个混入对象的数组。这些混入对象可以像正常的实例对象一样包含实例选项,这些选项将会被合并到最终的选项中,使用的是和 Vue.extend() 一样的选项合并逻辑。也就是说,如果你的混入包含一个 created 钩子,而创建组件本身也有一个,那么两个函数都会被调用。

Mixin 钩子按照传入顺序依次调用,并在调用组件自身的钩子之前被调用。

在写uniapp开发项目时要完成 上拉实现分页的效果

但是页面中有许多地方都有分页,一些参数和 onReachBottom方法都是重复的。此时就可以使用mixins。

使用minins完成页面分页功能

我们可以创建mixins文件夹,将变量、方法等公共方入mixin里。

*created等生命周期、methods方法都可以声明

export default {
	data() {
		return {
		  page:1,
		  isRefresh:false,
		  page_size:5
		};
	},
	onReachBottom(){
		if(this.isRefresh){
			this.page++ 
			this.getlist()		
		}
	}, 
	created() {
		console.log("我是来自mixins")
	},
	methods:{
		
	}
};

 在需要引用的页面

 当引用成功时,data就相当于多了3个参数了 page:1,  isRefresh:false, page_size:5。还有个onReachBottom 上拉刷新方法,当上拉时就会调用getlist方法。

注意:此时在混入的页面一定要有这个方法getlist,这个就固定是获取数据的方法名了

 这样子我们就可以不用在所有的页面都要加分页参数和onReachBottom方法了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/29653.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

设计用户模块的schema

schema 在计算机科学中,schema通常指的是 数据结构的定义和约束。 关系型数据库 在关系型数据库中,schema指的是数据库中所有表格的定义和表格之间的关系约束,包括每个表格的列名、数据类型、主键、外键等等。 如果要对一个关系型数据库进行…

Leetcode-6425. 找到最长的半重复子字符串

题目描述 给你一个下标从 0 开始的字符串 s ,这个字符串只包含 0 到 9 的数字字符。 如果一个字符串 t 中至多有一对相邻字符是相等的,那么称这个字符串是 半重复的 。 请你返回 s 中最长 半重复 子字符串的长度。 一个 子字符串 是一个字符串中一段…

力扣日记2481

1. 题目 LeetCode 2481. 分割圆的最少切割次数 1.1 题意 可以使用直接或半径切分,管他叫一次切分,求切分圆为n等份的最少次数。 1.2 分析 可以想到,对圆做n等分,然后每个半径看出一次切分,这是最多次数,…

Python3 列表与元组 | 菜鸟教程(六)

目录 一、Python3 列表 (一)简介相关 1、序列是 Python 中最基本的数据结构。 2、序列中的每个值都有对应的位置值,称之为索引,第一个索引是 0,第二个索引是 1,依此类推。 3、Python 有 6 个序列的内置…

算法刷题-字符串-替换空格

题目:剑指Offer 05.替换空格 力扣题目链接 请实现一个函数,把字符串 s 中的每个空格替换成"%20"。 示例 1: 输入:s “We are happy.” 输出:“We%20are%20happy.” 思路 如果想把这道题目做到极致&…

webpack提升开发体验SourceMap

一、开发场景介绍 开发中我们不可避免的会写一些bug出来,这时候要调试,快速定位到bug到底出现在哪尤为关键。 例如我故意在sum函数中写一个错误代码如下: 这时我们用前面章节已经写好的开发模式的webpack.dev.js运行,控制台会出…

【总结笔记】Spring

1 Spring容器加载配置文件进行初始化。 Spring容器加载配置文件进行初始化主要有两种形式: 加载配置文件进行初始化: ClassPathXmlApplicationContext ctx new ClassPathXmlApplicationContext(“ApplicationContext.xml”); 加载配置类进行初始化&…

业务流程自动化:ThinkAutomation Professional Crack

ThinkAutomation 助力您的业务流程自动化。自动执行本地和基于云的业务流程,以降低成本并节省时间。 自动化传入的通信渠道,监控数据库,对传入的Webhook,Web表单和聊天机器人做出反应。处理文档、附件、本地文件和其他邮件源。 …

基于Spark的气象数据分析

研究背景与方案 1.1.研究背景 在大数据时代背景下,各行业数据的规模大幅度增加,数据类别日益复杂,给数据分析工作带来极大挑战。气象行业和人们的生活息息相关,随着信息时代的发展,大数据技术的出现为气象数据的发展…

模板匹配笔记

模板匹配是一种最基本、最原始的模式识别的方法。通过对比某一特定物体的图案位于图像的什么地方,进而识别出物体。它是图像处理中最基本、最常用的匹配方法。它的局限性主要是它只能进行平行移动,若原图像中的匹配目标发生旋转或大小变化,该…

前端vue入门(纯代码)09

【09.vue中组件的自定义事件】 自定义组件链接 在vue中用的click【点击】、keyup【按键】……等事件,这些属于内置事件,也就是js自带的事件。 问题一:什么是组件自定义事件呢? 【内置事件】:是给html元素用的,比如s…

014、数据库管理之配置管理

配置管理 TiDB配置系统配置集群配置配置的存储位置区分TiDB的系统参数和集群参数 系统参数系统参数的作用域系统参数的修改 集群参数集群参数的修改配置参数的查看 实验一: 在不同作用域下对数据库的系统参数进行修改session级别global级别 实验二: 修改…

【TCP/IP】多进程服务器的实现(进阶) - 信号处理及signal、sigaction函数

目录 信号 signal函数 sigaction函数 用信号来处理僵尸进程 在之前我们学习了如何处理“僵尸进程”,不过可能也会有疑问:调用wait和waitpid函数时我们关注的始终是在子进程上,那么在父进程上如何实现对子进程的管控呢?为此&am…

零基础速成simulink代码生成——简单滤波器实现2

simulink setting 找到model settings solver求解器配置 Code Generation 代码生成配置 生成代码报告 添加stateflow注释 可以将变量保存在定义的文件(选) 实践 简单一阶滤波器

使用一键安装工具快速搭建 ESP-IDF 开发环境 (Windows)

我们收到用户对 ESP-IDF SDK 软件开发环境感到搭建难、门槛高的反馈。为解决用户在此方面的问题。为此,我们推出本期教程介绍在 Windows 操作系统下使用一键安装工具快速搭建 ESP-IDF 开发环境。 您可以观看下面的教程视频,也可以阅读接下来本篇的图文教…

CVPR 2023 | 图像超分,结合扩散模型/GAN/部署优化,low-level任务,视觉AIGC系列

1、Activating More Pixels in Image Super-Resolution Transformer 基于Transformer的方法在低级别视觉任务中,如图像超分辨率,表现出了令人印象深刻的性能。Transformer的潜力在现有网络中仍未得到充分发挥。为了激活更多的输入像素以实现更好的重建&a…

有哪些工具软件一旦用了就离不开?

💖前言 目前,随着科技的快速发展,电脑已经进入了许许多多人的生活 ,在平日的学习、工作和生活里,我们会用的各种各样的强大软件。市面上除了某些大公司开发在强大软件,还有各路大神开发具有某些功能的强大…

Java阶段四Day01

Java阶段四Day01 文章目录 Java阶段四Day01Security框架通配符Vue脚手架 Vue-cli关于VUE关于VUE Cli创建Vue Cli工程解决端口被占用 Vue工程的工程结构[.idea]【重要】[node_modules]【重要】[public]favicon.icoindex.html [src][assets][compnents]【重要】[router][store]【…

Spring基础知识(二)

目录 1.Spring Bean是什么 2.Spring提供的配置方式 3.Spring bean中的scope 4.Spring bean容器的生命周期 5.Spring的内部bean 6.Spring装配是什么 7.自动装配模式 8.自动装配的局限性 9.基于注解配置容器 10.如何启动注解装配 1.Spring Bean是什么 Spring官方文档对…

客户端负载均衡工具Ribbon

一 什么是Ribbon Ribbon介绍 目前主流的负载方案分为以下两种: 集中式负载均衡,在消费者和服务提供方中间使用独立的代理方式进行负载,有硬件的(比如 F5),也有软件的(比如 Nginx)…