【Vue】filter的用法
上一篇： vue的指令
https://blog.csdn.net/m0_67930426/article/details/134599378?spm=1001.2014.3001.5502
本篇所使用指令 v-for v-on v-html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><body><!--准备容器 -->
<div id="app"><h2>四大发明</h2><ul><li v-for="(item,index) in list"><span>{{item.name}}</span><span>{{item.creator}}</span><button @click="del(item.id)">删除</button></li><br><div v-html="url"></div></ul>
</div><!-- 引包 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><!-- 创建实例 -->
<script>
/* Vue.config.productionTip =false;*/var app=new Vue({el:'#app',data: {list:[{id:1, name:'造纸术',creator:'蔡伦'},{id:2, name:'指南针',creator:'栾(luan)大'},{id:3, name:'火药',creator:'孙思邈'},{id:4, name:'活字印刷术',creator:'毕升'},],url:'<a href="https://zhidao.baidu.com/question/37807254.html">百度知道</a>'},methods:{del(id){this.list=this.list.filter(item=> item.id!=id)}}});
</script>
</body>
</html>filter的作用：根据条件，保留满足条件的对应项，得到一个新数组
methods:{del(id){this.list=this.list.filter(item=> item.id!=id)}}注意： 方法名不能使用delete
意思是说 不能使用Javascript的关键字作为属性名
点击删除
再刷新一下
相关文章：
【Vue】filter的用法
上一篇： vue的指令 https://blog.csdn.net/m0_67930426/article/details/134599378?spm1001.2014.3001.5502 本篇所使用指令 v-for v-on v-html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"&…...
python web项目导包规范
python web项目导包规范 python 内置的模块通过第三方库安装的模块框架自身提供的模块用户自己定义的模块 如： from __future__ import absolute_import, unicode_literalsfrom debug_toolbar.panels import Panelfrom django.utils.translation import ugettext_…...
AtCoder Beginner Contest 330 题解
目录 A - Counting PassesB - Minimize Abs 1C - Minimize Abs 2D - Counting LsE - Mex and Update A - Counting Passes 原题链接 题目描述 给定N个数和一个整数L，输出大于等于L的数的个数。 public static void solve() throws IOException{int n readInt(), m…...
论文速读《DeepFusion: Lidar-Camera Deep Fusion for Multi-Modal 3D Object Detection》
概括主要内容 文章《DeepFusion: Lidar-Camera Deep Fusion for Multi-Modal 3D Object Detection》提出了两种创新技术，以改善多模态3D检测模型的性能，通过更有效地融合相机和激光雷达传感器数据来提高对象检测的准确性，尤其是在行人检测方面…...
关于前端处理后端轮询的操作 （总结）
使用场景：前端首次发起请求获取数据，若失败则每隔1s发起一次知道成功获取数据为止解决方案： 使用轮询操作，涉及定时器的使用和关闭 （使用vue2代码为例) data() {return {pollingResult_en: null, // 处理轮询结果bizI…...
【SpringCloud】设计原则之单一职责与服务拆分
一、设计原则之单一职责 设计原则很重要的一点就是简单，单一职责也就是所谓的专人干专事 一个单元（一个类、函数或微服务）应该有且只有一个职责 无论如何，一个微服务不应该包含多于一个的职责 职责单一的后果之一就是职责单…...
UDP分片和丢包与TCP效果对比
UDP 分片 与 丢包，UDP 真的比 TCP 高效吗？ UDP（用户数据报协议）和TCP（传输控制协议）在很多方面都有显著的区别。总体来说，TCP更适合需要可靠传输的应用，例如网页浏览、电子邮件等&a…...
Inport 模块
文章目录 Interpolate datainport 模块存在于模型最顶层Port Dimension 和 Variable-size signal Interpolate data Interpolate data：当将 Workspace 的数据导人模型时, 对没有对应数据点的采样时刻进行线性插值的开关选项。 inport 模块存在于模型最顶层 inpo…...
Deep Learning for Monocular Depth Estimation: A Review.基于深度学习的深度估计
传统的深度估计方法通常是使用双目相机，计算两个2D图像的视差，然后通过立体匹配和三角剖分得到深度图。然而，双目深度估计方法至少需要两个固定的摄像机，当场景的纹理较少或者没有纹理的时候，很难从图像中捕捉足够的特…...
点云从入门到精通技术详解100篇-基于深度学习的稀疏点云障碍物检测（续）
目录 3.1 连续帧点云空间特征融合 3.1.1 点云预处理 3.1.2 地面分割 3.1.3 自适应点云聚类...
使用VSCode+PlatformIO搭建ESP32开发环境
Arduino IDE本来就是为创客们开发的，虽然没代码提示功能，文件的关系也不清晰，函数不能跳转，头文件也打不开，但人家的初衷就是为了简单而生的；但还是有一些同学喜欢高级点的IDE，也没问题…...
使用flask返回json格式的数据
Flask Flask是一个使用Python编写的轻量级Web框架，它的设计理念是保持简单、灵活和易扩展。它的核心是Werkzeug和Jinja2，并且它本身只提供了非常基础的Web框架功能，例如路由和请求处理等。 使用Flask可以快速创建一个Web应用程序，…...
如何排查java 内存溢出OutOfMemoryError？
当使用Spring Boot进行文件上传时，文件会被读取到内存中进行处理。如果上传的文件较大，会占用大量的内存空间，从而导致内存溢出（OutOfMemory）问题。以下是一些建议的排查方案： 调整 JVM 内存设置ÿ…...
Prometheus环境搭建和认识
Prometheus 环境搭建 1.prometheus 简介 Prometheus是基于go语言开发的一套开源的监控、报警和时间序列数据库的组合，是由SoundCloud公司开发的开源监控系统，Prometheus于2016年加入CNCF（Cloud Native Computing Foundation,云原生计算基金…...
openGauss学习笔记-130 openGauss 数据库管理-参数设置-重设参数
文章目录 openGauss学习笔记-130 openGauss 数据库管理-参数设置-重设参数130.1 背景信息130.2 GUC参数设置130.3 操作步骤130.4 示例 openGauss学习笔记-130 openGauss 数据库管理-参数设置-重设参数 130.1 背景信息 openGauss提供了多种修改GUC参数的方法，用户可…...
每日OJ题_算法_双指针_力扣11. 盛最多水的容器
力扣11. 盛最多水的容器 11. 盛最多水的容器 - 力扣（LeetCode） 难度 中等 给定一个长度为 n 的整数数组 height 。有 n 条垂线，第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。 找出其中的两条线，使得它们与 x 轴共同构成…...
数据仓库
一. 各种名词解释 1.1 ODS是什么？ ODS层最好理解，基本上就是数据从源表拉过来，进行etl，比如mysql 映射到hive，那么到了hive里面就是ods层。 ODS 全称是 Operational Data Store，操作数据存储.“面向主题的…...
Redis常用操作及应用（一）
一、五种数据结构 二、String结构 1、字符串常用操作 SET key value //存入字符串键值对 MSET key value [key value ...] //批量存储字符串键值对 SETNX key value //存入一个不存在的字符串键值对 GET key //获取一个字符串键值 MGET key [ke…...
数据结构-树
参考：https://www.hello-algo.com/chapter_tree/binary_tree/#711 1. 介绍 树存储不同于数组和链表的地方在于既可以保证数据检索的速度，又可以保证数据插入删除修改的速度，二者兼顾。 二叉树是一种很重要的数据结构，是非线性的…...
解决ElementUI时间选择器回显出现Wed..2013..中国标准时间.
使用饿了么组件 时间日期选择框回显到页面为啥是这样的？ 为什么再时间框中选择日期，回显页面出现了这种英文格式呢？？？？ 其实这个问题直接使用elementui的内置属性就能解决 DateTimePicker 日期时间选择…...
龙虎榜——20250610
上证指数放量收阴线，个股多数下跌，盘中受消息影响大幅波动。 深证指数放量收阴线形成顶分型，指数短线有调整的需求，大概需要一两天。 2025年6月10日龙虎榜行业方向分析 1. 金融科技 代表标的：御银股份、雄帝科技 驱动…...
3.3.1_1 检错编码（奇偶校验码）
从这节课开始，我们会探讨数据链路层的差错控制功能，差错控制功能的主要目标是要发现并且解决一个帧内部的位错误，我们需要使用特殊的编码技术去发现帧内部的位错误，当我们发现位错误之后，通常来说有两种解决方案。第一…...
Debian系统简介
目录 Debian系统介绍 Debian版本介绍 Debian软件源介绍 软件包管理工具dpkg dpkg核心指令详解 安装软件包 卸载软件包 查询软件包状态 验证软件包完整性 手动处理依赖关系 dpkg vs apt Debian系统介绍 Debian 和 Ubuntu 都是基于 Debian内核 的 Linux 发行版ÿ…...
学校招生小程序源码介绍
基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码，专为学校招生场景量身打造，功能实用且操作便捷。 从技术架构来看，ThinkPHP提供稳定可靠的后台服务，FastAdmin加速开发流程，UniApp则保障小程序在多端有良好的兼…...
汇编常见指令
汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX（不访问内存）XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...
Java面试专项一-准备篇
一、企业简历筛选规则 一般企业的简历筛选流程：首先由HR先筛选一部分简历后，在将简历给到对应的项目负责人后再进行下一步的操作。 HR如何筛选简历 例如：Boss直聘（招聘方平台） 直接按照条件进行筛选 例如：…...
稳定币的深度剖析与展望
一、引言 在当今数字化浪潮席卷全球的时代，加密货币作为一种新兴的金融现象，正以前所未有的速度改变着我们对传统货币和金融体系的认知。然而，加密货币市场的高度波动性却成为了其广泛应用和普及的一大障碍。在这样的背景下，稳定…...
docker 部署发现spring.profiles.active 问题
报错： org.springframework.boot.context.config.InvalidConfigDataPropertyException: Property spring.profiles.active imported from location class path resource [application-test.yml] is invalid in a profile specific resource [origin: class path re…...
华硕a豆14 Air香氛版，美学与科技的馨香融合
在快节奏的现代生活中，我们渴望一个能激发创想、愉悦感官的工作与生活伙伴，它不仅是冰冷的科技工具，更能触动我们内心深处的细腻情感。正是在这样的期许下，华硕a豆14 Air香氛版翩然而至，它以一种前所未有的方式&#x…...
服务器--宝塔命令
一、宝塔面板安装命令 ⚠️ 必须使用 root 用户 或 sudo 权限执行！ sudo su - 1. CentOS 系统： yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh2. Ubuntu / Debian 系统…...