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

lodash-es

<template><div class="content"><input type="text" v-model="valinput" placeholder="请输入内容" v-focus /><div><h2><font color="#6F42C1">1. chunk</font></h2><p>将数组(array)拆分成多个 size 长度的区块,并将这些区块组成一个新数组。如果 array无法被分割成全部等长的区块,那么最后剩余的元素将组成一个区块。</p><p>_.chunk(['a', 'b', 'c', 'd'], 2) // [['a', 'b'], ['c', 'd']]</p><p>_.chunk(['a', 'b', 'c', 'd'], 3) // [['a', 'b', 'c'], ['d']]</p><el-button @click="chunkClick">chunkList2</el-button><el-button @click="chunkClick3">chunkList3</el-button><span v-show="chunkResult"> 运行结果:{{ chunkResult }}</span></div><!-- compact 方法示例 --><div><h2><font color="#6F42C1">2. compact</font></h2><p>创建一个新数组,包含原数组中所有的非假值元素。例如 false, null, 0, "",undefined, 和 NaN 都是被认为是“假值”。</p><p>[0, 1, false, 2, '', undefined, null, NaN, 3] // [1, 2, 3]</p><el-button @click="compactClick">compactList</el-button><span v-show="compactResult"> 运行结果:{{ compactResult }}</span></div><!--concat 方法示例 --><div><h2><font color="#6F42C1">3. concat</font></h2><p>将所有给定数组中的元素连接在一起。如果传入的值是可遍历的(比如对象),那么 _.concat 会将这些值转为数组。如果传入的值是 null 或 undefined,那么将返回一个空数组。</p><p>array = [1];2, [3], [[4]] // [1, 2, 3, 4]</p><el-button @click="concatClick">concatList</el-button><span v-show="concatResult"> 运行结果:{{ concatResult }}</span></div></div>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import _ from "lodash-es";
const valinput = ref("");
const vFocus = {mounted(el: any) {el.focus();el.style.color = "red";el.style.background = "yellow";},
};
const chunkList = ref(["a", "b", "c", "d"]);
const chunkSize2 = ref(2);
const chunkSize3 = ref(3);
const chunkResult = ref();
const chunkClick = () => {chunkResult.value = _.chunk(chunkList.value, chunkSize2.value);
};
const chunkClick3 = () => {chunkResult.value = _.chunk(chunkList.value, chunkSize3.value);
};
const compactList = ref([0, 1, false, 2, "", undefined, null, NaN, 3]);
const compactResult = ref();
const compactClick = () => {compactResult.value = _.compact(compactList.value);
};var array = [1];const concatResult = ref();const concatClick =()=>{console.log("222:",array,2, [3], [[4]]); concatResult.value =_.concat(array,2, [3], [[4]]);};</script>
<style lang="scss" scoped></style>
chunk、compact、concat

<template>
<div class="content">
<input type="text" v-model="valinput" placeholder="请输入内容" v-focus />
<div>
<h2><font color="#6F42C1">1. chunk</font></h2>
<p>
将数组(array)拆分成多个 size 长度的区块,并将这些区块组成一个新数组。
如果 array
无法被分割成全部等长的区块,那么最后剩余的元素将组成一个区块。
</p>
<p>_.chunk(['a', 'b', 'c', 'd'], 2) // [['a', 'b'], ['c', 'd']]</p>
<p>_.chunk(['a', 'b', 'c', 'd'], 3) // [['a', 'b', 'c'], ['d']]</p>
<el-button @click="chunkClick">chunkList2</el-button>
<el-button @click="chunkClick3">chunkList3</el-button>
<span v-show="chunkResult"> 运行结果:{{ chunkResult }}</span>
</div>

    <!-- compact 方法示例 -->
<div>
<h2><font color="#6F42C1">2. compact</font></h2>
<p>
创建一个新数组,包含原数组中所有的非假值元素。例如 false, null, 0, "",
undefined, 和 NaN 都是被认为是“假值”。
</p>
<p>[0, 1, false, 2, '', undefined, null, NaN, 3] // [1, 2, 3]</p>
<el-button @click="compactClick">compactList</el-button>
<span v-show="compactResult"> 运行结果:{{ compactResult }}</span>
</div>
<!--concat 方法示例 -->
<div>
<h2><font color="#6F42C1">3. concat</font></h2>
<p>
将所有给定数组中的元素连接在一起。
如果传入的值是可遍历的(比如对象),那么 _.concat 会将这些值转为数组。
如果传入的值是 null 或 undefined,那么将返回一个空数组。
</p>
<p>array = [1];2, [3], [[4]] // [1, 2, 3, 4]</p>
<el-button @click="concatClick">concatList</el-button>
<span v-show="concatResult"> 运行结果:{{ concatResult }}</span>
</div>
</div>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import _ from "lodash-es";
const valinput = ref("");
const vFocus = {
mounted(el: any) {
el.focus();
el.style.color = "red";
el.style.background = "yellow";
},
};
const chunkList = ref(["a", "b", "c", "d"]);
const chunkSize2 = ref(2);
const chunkSize3 = ref(3);
const chunkResult = ref();
const chunkClick = () => {
chunkResult.value = _.chunk(chunkList.value, chunkSize2.value);
};
const chunkClick3 = () => {
chunkResult.value = _.chunk(chunkList.value, chunkSize3.value);
};
const compactList = ref([0, 1, false, 2, "", undefined, null, NaN, 3]);
const compactResult = ref();
const compactClick = () => {
compactResult.value = _.compact(compactList.value);
};


var array = [1];

const concatResult = ref();
const concatClick =()=>{
console.log("222:",array,2, [3], [[4]]); 
concatResult.value =_.concat(array,2, [3], [[4]]);
};

</script>
<style lang="scss" scoped></style>

http://www.dtcms.com/a/515361.html

相关文章:

  • 股票交易网站建设四会市城乡规划建设局网站
  • API技术深度解析:从基础原理到最佳实践
  • 西安今晚12点封城吗龙岩网站优化
  • 使用有限体积法求解双曲型守恒性方程(一)FV 框架
  • jenkins流水线部署springboot项目
  • YOLOv5:目标检测的实用派王者
  • 《工业之心:Blender 工业场景解构》
  • 【Linux网络】应用层自定义协议
  • unity免费改名工具-Mulligan Renamer
  • Git分支的多人协作
  • 服务外包网站成都住建局官网app
  • 【ABAP函数】+ALSM_EXCEL_TO_INTERNAL_TABLE批导长字段
  • 艺术学院网站模板wordpress二手车模板
  • docker api 常用接口
  • flutter鸿蒙:实现类似B站或抖音的弹幕功能
  • 从静态模型到数据驱动:图观模型编辑器让工程设备真实还原
  • 了解Docker的多阶段构建(Multi-stage Build)
  • [特殊字符] Berry.Live:开箱即用的.NET直播流媒体服务器
  • 网站模板的修改宝安企业网站建设
  • 网站开发软件费用2018网站流量怎么做
  • 数据结构:顺序表讲解(1)
  • 第二次作业-第二章时间服务
  • Python爬虫实战:获取香港恒生指数历史数据与趋势分析
  • 【Frida Android】基础篇11:Native层hook基础——修改原生函数的返回值
  • 什么是DNS负载均衡?提升网站稳定性与容错性的方法
  • 设计自学网站哪个好建设银行网站怎么短信转账
  • 网站如何做seo优化教程迪虎科技网站建设
  • win10底部搜索栏怎么关闭 图文详解
  • 网站备案密码是什么样的大冶建设局网站
  • python学习之进程