若依前端分离版中使用二维码功能

一、安装

在前端项目工程目录,远端执行如下命令

// npm
npm install vue-qr --save
// yarn
yarn add vue-qr

二、引入组件

        在main.js文件中增加如下的内容

// vue2.x
import VueQr from 'vue-qr'
//注册组件
Vue.component('VueQr', VueQr)

// vue3.x
import vueQr from 'vue-qr/src/packages/vue-qr.vue'
三、使用方法

功能一:生成二维码
<template><div class="dynamic-qrCode-container"><div class="dynamic-operate"><el-inputclass="common-input input-qrCode"v-model="text"></el-input><el-button type="primary" class="common-button" @click="handleQrCode(1)">生成普通二维码</el-button><el-button type="primary" class="common-button" @click="handleQrCode(2)">生成带logo二维码</el-button><el-button type="primary" class="common-button" @click="handleQrCode(3)">生成随机颜色二维码</el-button><el-button type="primary" class="common-button" @click="handleQrCode(4)">下载二维码</el-button></div><vue-qrref="qrCode":text="text":logoSrc="logoSrc":color-dark="randomColor":callback="qrCodeCallback"width="100"height="100"></vue-qr></div>
</template>
      <el-table-column label="条码格式" align="center"><template slot-scope="scope"><vue-qr ref="qrCode" :text="mytext" width="100" height="100"></vue-qr></template></el-table-column>

参数说明:

text:二维码的内容,即扫出来的结果。

logoSrc:嵌入二维码中心的logo图片地址。

color-dark:实点的颜色,即有色部分。修改该值可改变实点的颜色,即二维码整体展示的颜色。

callback:生成的二维码 Data URI 可以在回调中取得,第一个参数为二维码 data URL, 第二个参数为 props 传过来的 qid(因为二维码生成是异步的,所以加个 id 用于排序)

import VueQr from 'vue-qr'
import logo from '@/assets/image/logo.png'
import { getColor } from '@/utils/index.js'
export default {name: 'dynamicQrCode',components:{VueQr,},data(){return{text: 'https://zhuanlan.zhihu.com/p/427065468',logoSrc: '',randomColor: 'black',qrCodeUrl: '', // 存放生成的二维码url}},methods:{qrCodeCallback(url){this.qrCodeUrl = url},handleQrCode(type){switch (type){case 1:this.randomColor = 'black'this.logoSrc = ''breakcase 2:this.logoSrc = logobreakcase 3:this.randomColor = getColor()breakcase 4:let name  = new Date().getTime();let a = document.createElement("a");a.style.display = "none";a.download = name;a.href = this.qrCodeUrl;document.body.appendChild(a);a.click();a.remove()break}},}
}


生成随机颜色

// 生成随机颜色
export function getColor() {var str = '#'var arr = ['1', '2', '3', '4', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f']for (var i = 0; i < 6; i++) {var num = parseInt(Math.random() * 16)str += arr[num]}return str
}


效果图


 

功能二:打印二维码


该功能需要用到vue-print-nb打印插件,需先安装插件。该插件的安装及使用可以看一下这篇文章(插入链接)。

实现勾选表格的数据,用表格的selection-change事件,当勾选的数据发生变化时,实时获取到已勾选的数据。

<div class="print-qrCode-container"><div class="button-operate"><el-button:type="buttonType"class="common-button plain-button"@click="handleLogo":class="showLogo ? 'success-button': ''"><i class="iconfont com-icon icon-check-empty"></i><span>带logo</span></el-button><el-button type="primary" class="common-button" v-print="'#printQrCode'"><i class="iconfont com-icon icon-printer"></i><span>打印二维码</span></el-button></div><div class="url-container"><el-table:data="tableData"height="calc(100vh - 280px)"border@selection-change="onChange"<el-table-column type="selection" align="center" width="55"></el-table-column><el-table-column label="文章编号" prop="order"></el-table-column><el-table-column label="文章描述" prop="decs"></el-table-column><el-table-column label="分栏类型" prop="programSort"></el-table-column><el-table-column label="创作类型" prop="produceSort"></el-table-column><el-table-column label="可见范围" prop="visibleRange"></el-table-column><el-table-column label="文章热度" prop="hot" width="100"></el-table-column></el-table></div></div>

onChange事件,勾选行,赋值给printQrCode

   onChange(val){this.printQrCode = val},


存放已勾选的数据生成的二维码

<div class="qrCode-container"><div id="printQrCode"><divv-for="item in printQrCode"class="qrCode-content"><vue-qrref="qrCode":text="item.url":logoSrc="showLogo ? item.logo : ''"size="400"></vue-qr></div></div></div>


这里不希望在页面上显示已生成的二维码

.qrCode-container{width: 0;height: 0;overflow: hidden;
}


在打印时希望,一张纸只打印一个二维码,使用样式page-break-after: always

.qrCode-content{margin-top: 200px;margin-left: 160px;page-break-after:always
}


打印二维码不带logo的效果图

 打印二维码带logo的效果图

前端(若依-vue2版本)实现生成二维码,并提供下载功能_若依 微信小程序二维码-CSDN博客


 

<template><div class="app-container"><el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"><el-form-item label="条码类型" prop="barcodeType"><el-select v-model="queryParams.barcodeType" placeholder="请选择条码类型"><el-option v-for="dict in dict.type.mes_barcode_type" :key="dict.value" :label="dict.label":value="dict.value"></el-option></el-select></el-form-item><el-form-item label="业务编码" prop="bussinessCode"><el-input v-model="queryParams.bussinessCode" placeholder="请输入业务编码" clearable @keyup.enter.native="handleQuery" /></el-form-item><el-form-item label="业务名称" prop="bussinessName"><el-input v-model="queryParams.bussinessName" placeholder="请输入业务名称" clearable @keyup.enter.native="handleQuery" /></el-form-item><el-form-item><el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button><el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button></el-form-item></el-form><el-row :gutter="10" class="mb8"><el-col :span="1.5"><el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"v-hasPermi="['mes:wm:barcode:add']">新增</el-button></el-col><el-col :span="1.5"><el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"v-hasPermi="['mes:wm:barcode:remove']">删除</el-button></el-col><el-col :span="1.5"><el-button type="success" icon="el-icon-s-tools" size="mini" @click="handleConfig"v-hasPermi="['mes:wm:barcode:edit']">条码设置</el-button></el-col><el-col :span="1.5"><el-button type="primary" icon="el-icon-printer" size="mini" @click="handleBatchPrint"v-hasPermi="['mes:wm:barcode:view']">批量打印</el-button></el-col><Barcodeconfig ref="barcodeconfig"></Barcodeconfig><BarcodeBatchPrint ref="barcodebatchprint"></BarcodeBatchPrint><right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar></el-row><el-table v-loading="loading" :data="barcodeList" @selection-change="handleSelectionChange"><el-table-column type="selection" width="55" align="center" /><el-table-column label="条码" align="center"><template slot-scope="scope"><el-image @click="handleView(scope.row)" class="barcodeClass" fit="scale-down" :src="scope.row.barcodeUrl"><div slot="error" class="image-slot"><i class="el-icon-picture-outline"></i></div></el-image></template></el-table-column><el-table-column label="条码格式" align="center"><template slot-scope="scope"><vue-qr ref="qrCode" :text="mytext" width="100" height="100"></vue-qr></template></el-table-column><el-table-column label="条码格式" align="center"><template slot-scope="scope"><el-button size="mini" type="text" @click="onItemClick(scope.row)">打开二维码</el-button></template></el-table-column><el-table-column label="条码格式" align="center" prop="barcodeFormart"><template slot-scope="scope"><dict-tag :options="dict.type.mes_barcode_formart" :value="scope.row.barcodeFormart" /></template></el-table-column><el-table-column label="条码类型" align="center" prop="barcodeType"><template slot-scope="scope"><dict-tag :options="dict.type.mes_barcode_type" :value="scope.row.barcodeType" /></template></el-table-column><el-table-column label="条码内容" align="center" prop="barcodeContent" /><el-table-column label="业务编码" align="center" prop="bussinessCode" /><el-table-column label="业务名称" align="center" prop="bussinessName" /><el-table-column label="是否生效" align="center" prop="enableFlag"><template slot-scope="scope"><dict-tag :options="dict.type.sys_yes_no" :value="scope.row.enableFlag" /></template></el-table-column><el-table-column label="操作" align="center" class-name="small-padding fixed-width"><template slot-scope="scope"><el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"v-hasPermi="['mes:wm:barcode:edit']">编辑</el-button><el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"v-hasPermi="['mes:wm:barcode:remove']">删除</el-button></template></el-table-column></el-table><pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"@pagination="getList" /><!-- 添加或修改条码清单对话框 --><el-dialog :title="title" :visible.sync="open" width="960px" append-to-body><el-form ref="form" :model="form" :rules="rules" label-width="100px"><el-row><el-col :span="8"><el-form-item label="条码格式" prop="barcodeFormart"><el-select v-model="form.barcodeFormart" placeholder="请选择条码格式"><el-option v-for="dict in dict.type.mes_barcode_formart" :key="dict.value" :label="dict.label":value="dict.value"></el-option></el-select></el-form-item></el-col><el-col :span="8"><el-form-item label="条码类型" prop="barcodeType"><el-select v-model="form.barcodeType" placeholder="请选择条码类型"><el-option v-for="dict in dict.type.mes_barcode_type" :key="dict.value" :label="dict.label":value="dict.value"></el-option></el-select></el-form-item></el-col><el-col :span="8"><el-form-item label="是否启用"><el-radio-group v-model="form.enableFlag" disabled v-if="optType == 'view'"><el-radio v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.value">{{ dict.label}}</el-radio></el-radio-group><el-radio-group v-model="form.enableFlag" v-else><el-radio v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.value">{{ dict.label}}</el-radio></el-radio-group></el-form-item></el-col></el-row><!--根据不同的条码类型展示不同的业务内容选择 start--><!--物料产品--><el-row v-if="form.barcodeType == 'ITEM'"><el-col :span="12"><el-form-item label="物料编码" prop="bussinessCode"><el-input v-model="form.bussinessCode" readonly="readonly" placeholder="请选择物料编码"><el-button slot="append" @click="handleSelectProduct" icon="el-icon-search"></el-button></el-input></el-form-item><ItemSelect ref="itemSelect" @onSelected="onItemSelected"> </ItemSelect></el-col><el-col :span="12"><el-form-item label="物料名称" prop="bussinessName"><el-input v-model="form.bussinessName" readonly="readonly" /></el-form-item></el-col></el-row><!--仓库--><el-row v-if="form.barcodeType == 'WAREHOUSE'"><el-col :span="24"><el-form-item label="储位" prop="warehouseId"><!-- <el-cascader v-model="warehouseInfo":options="warehouseOptions":props="warehouseProps"@change="handleWarehouseChanged">                  </el-cascader> --><el-cascader v-model="warehouseInfo" ref="warehouseRef" :options="warehouseOptions" :props="warehouseProps"@change="handleWarehouseChanged"></el-cascader></el-form-item></el-col></el-row><!--箱条码--><el-row v-if="form.barcodeType == 'BOX'"><el-col :span="12"><el-form-item label="装箱单号" prop="packageCode"><el-input v-model="form.bussinessCode" readonly="readonly" placeholder="请选择装箱单"><el-button slot="append" @click="handleSelectPackage" icon="el-icon-search"></el-button></el-input></el-form-item><PackageSelectSingle ref="packageSelect" :status="'FINISHED'" @onSelected="onPackageSelected"></PackageSelectSingle></el-col><el-col :span="12"><el-form-item label="客户名称" prop="bussinessName"><el-input v-model="form.bussinessName" readonly="readonly" /></el-form-item></el-col></el-row><!--供应商--><el-row v-else-if="form.barcodeType == 'VENDOR'"><el-col :span="12"><el-form-item label="供应商编号" prop="bussinessCode"><el-input v-model="form.bussinessCode" readonly="readonly" placeholder="请选择供应商"><el-button slot="append" @click="handleSelectVendor" icon="el-icon-search"></el-button></el-input><VendorSelect ref="vendorSelect" @onSelected="onVendorSelected" /></el-form-item></el-col><el-col :span="12"><el-form-item label="供应商名称" prop="bussinessName"><el-input v-model="form.bussinessName" readonly="readonly"></el-input></el-form-item></el-col></el-row><!-- 工作站 --><el-row v-else-if="form.barcodeType == 'WORKSTATION'"><el-col :span="12"><el-form-item label="工作站" prop="bussinessCode"><el-input v-model="form.bussinessCode" placeholder="请选择工作站"><el-button slot="append" icon="el-icon-search" @click="handleWorkstationSelect"></el-button></el-input></el-form-item><WorkstationSelect ref="wsSelect" @onSelected="onWorkstationSelected"> </WorkstationSelect></el-col><el-col :span="12"><el-form-item label="工作站名称" prop="bussinessName"><el-input v-model="form.bussinessName" readonly="readonly"></el-input></el-form-item></el-col></el-row><!-- 库存 --><el-row v-else-if="form.barcodeType == 'STOCK'"><el-col :span="8"><el-form-item label="物资编码" prop="bussinessCode"><el-input v-model="form.bussinessCode" placeholder="请选择库存记录"><el-button slot="append" icon="el-icon-search" @click="handleMaterialStockSelect"></el-button></el-input></el-form-item><StockSelect ref="stockSelect" @onSelected="onMaterialStockSelected"> </StockSelect></el-col><el-col :span="16"><el-form-item label="物资信息" prop="bussinessName"><el-input v-model="form.bussinessName" readonly="readonly"></el-input></el-form-item></el-col></el-row><!--根据不同的条码类型展示不同的业务内容选择 end--><el-row><el-col :span="24"><el-form-item label="条码内容"><el-input v-model="form.barcodeContent" /></el-form-item></el-col></el-row><el-row><el-col :span="24"><el-form-item label="条码" prop="url"><el-image class="barcodeFormClass" :src="form.barcodeUrl"><div slot="error" class="image-slot"><i class="el-icon-picture-outline"></i></div></el-image></el-form-item></el-col></el-row><el-row><el-col :span="24"><el-form-item label="备注" prop="remark"><el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /></el-form-item></el-col></el-row></el-form><div slot="footer" class="dialog-footer"><el-button type="primary" @click="cancel" v-if="optType == 'view'">返回</el-button><el-button type="primary" @click="submitForm" v-if="optType != 'view'">保 存</el-button><el-button @click="cancel">取 消</el-button></div></el-dialog><!-- 二维码弹窗 --><el-dialog :title="title" :visible.sync="show" width="500px" append-to-body><div style="justify-content: center;align-items: center;display: flex;"  ><vue-qr ref="qrCode" :text="mytext" width="100" height="100"></vue-qr></div><div slot="footer" class="dialog-footer"><el-button type="primary"  >下 载</el-button><el-button >取 消</el-button></div></el-dialog></div>
</template><script>
import { listBarcode, getBarcode, delBarcode, addBarcode, updateBarcode } from "@/api/mes/wm/barcode";
import ItemSelect from "@/components/itemSelect/single.vue";
import VendorSelect from "@/components/vendorSelect/single.vue";
import PackageSelectSingle from "@/components/package/single.vue";
import WorkstationSelect from "@/components/workstationSelect/simpletableSingle.vue"
import StockSelect from "@/components/stockSelect/single.vue"
import Barcodeconfig from "./config.vue"
import BarcodeBatchPrint from "./batchprint.vue"
import { getTreeList } from "@/api/mes/wm/warehouse"import VueQr from 'vue-qr'export default {name: "Barcode",dicts: ['mes_barcode_type', 'mes_barcode_formart', 'sys_yes_no'],components: {ItemSelect, VendorSelect, PackageSelectSingle, Barcodeconfig, WorkstationSelect, StockSelect, BarcodeBatchPrint},data() {return {warehouseInfo: [],warehouseOptions: [],warehouseProps: {multiple: false,value: 'pId',label: 'pName',},optType: null,// 遮罩层loading: true,// 选中数组ids: [],// 非单个禁用single: true,// 非多个禁用multiple: true,// 显示搜索条件showSearch: true,// 总条数total: 0,// 条码清单表格数据barcodeList: [],// 弹出层标题title: "",// 是否显示弹出层open: false,mytext: "123",show:false,// 查询参数queryParams: {pageNum: 1,pageSize: 10,barcodeFormart: null,barcodeType: null,barcodeContent: null,bussinessId: null,bussinessCode: null,bussinessName: null,barcodeUrl: null,enableFlag: null},// 表单参数form: {},// 表单校验rules: {barcodeFormart: [{ required: true, message: "条码格式不能为空", trigger: "blur" }],barcodeType: [{ required: true, message: "条码类型不能为空", trigger: "change" }],barcodeContent: [{ required: true, message: "产品物料ID不能为空", trigger: "blur" }],}};},created() {this.getList();this.getWarehouseList();},methods: {/** 查询条码清单列表 */getList() {this.loading = true;listBarcode(this.queryParams).then(response => {this.barcodeList = response.rows;this.total = response.total;this.loading = false;});},// 取消按钮cancel() {this.open = false;this.reset();},// 表单重置reset() {this.form = {barcodeId: null,barcodeFormart: null,barcodeType: null,barcodeContent: null,bussinessId: null,bussinessCode: null,bussinessName: null,barcodeUrl: null,enableFlag: 'Y',remark: null,attr1: null,attr2: null,attr3: null,attr4: null,createBy: null,createTime: null,updateBy: null,updateTime: null};this.resetForm("form");},//生成二维码onItemClick(row) {console.log(row);this.show = true;this.title = '二维码';this.mytext=row.barcodeContent;},/** 搜索按钮操作 */handleQuery() {this.queryParams.pageNum = 1;this.getList();},/** 重置按钮操作 */resetQuery() {this.resetForm("queryForm");this.handleQuery();},// 多选框选中数据handleSelectionChange(selection) {this.ids = selection.map(item => item.barcodeId)this.single = selection.length !== 1this.multiple = !selection.length},/** 新增按钮操作 */handleAdd() {this.reset();this.open = true;this.title = "添加条码";this.optType = "add";},handleView(row) {this.reset();const barcodeId = row.barcodeIdgetBarcode(barcodeId).then(response => {this.form = response.data;this.open = true;this.title = "查看条码";this.optType = "view";});},/** 修改按钮操作 */handleUpdate(row) {this.reset();const barcodeId = row.barcodeId || this.idsgetBarcode(barcodeId).then(response => {this.form = response.data;this.open = true;this.title = "修改条码";this.optType = "edit";});},/** 提交按钮 */submitForm() {this.$refs["form"].validate(valid => {if (valid) {if (this.form.barcodeId != null) {updateBarcode(this.form).then(response => {console.log(response);this.$modal.msgSuccess("修改成功");this.open = false;this.getList();});} else {addBarcode(this.form).then(response => {this.$modal.msgSuccess("新增成功");this.open = false;this.getList();});}}});},/** 删除按钮操作 */handleDelete(row) {const barcodeIds = row.barcodeId || this.ids;this.$modal.confirm('是否确认删除条码清单编号为"' + barcodeIds + '"的数据项?').then(function () {return delBarcode(barcodeIds);}).then(() => {this.getList();this.$modal.msgSuccess("删除成功");}).catch(() => { });},/** 导出按钮操作 */handleExport() {this.download('wm/barcode/export', {...this.queryParams}, `barcode_${new Date().getTime()}.xlsx`)},//物料选择handleSelectProduct() {this.$refs.itemSelect.showFlag = true;},//物料选择弹出框onItemSelected(obj) {if (obj != undefined && obj != null) {this.form.bussinessId = obj.itemId;this.form.bussinessCode = obj.itemCode;this.form.bussinessName = obj.itemName;this.form.barcodeContent = "".concat(this.form.barcodeType, '-', this.form.bussinessCode);}},//选择仓库、库区、库位getWarehouseList() {getTreeList().then(response => {if (response.data) {this.warehouseOptions = response.data.filter((el) => {return el.warehouseCode.indexOf('VIR') == -1;});;}this.warehouseOptions.map(w => {debugger;w.children.map(l => {let lstr = JSON.stringify(l.children).replace(/locationId/g, 'lId').replace(/areaId/g, 'pId').replace(/areaName/g, 'pName');l.children = JSON.parse(lstr);});let wstr = JSON.stringify(w.children).replace(/warehouseId/g, 'wId').replace(/locationId/g, 'pId').replace(/locationName/g, 'pName');w.children = JSON.parse(wstr);});let ostr = JSON.stringify(this.warehouseOptions).replace(/warehouseId/g, 'pId').replace(/warehouseName/g, 'pName');this.warehouseOptions = JSON.parse(ostr);debugger;});},handleWarehouseChanged(obj) {debugger;const checkedNode = this.$refs['warehouseRef'].getCheckedNodes();if (obj != null) {this.form.bussinessId = checkedNode[0].data.pId;this.form.bussinessCode = checkedNode[0].data.areaCode;this.form.bussinessName = checkedNode[0].data.pName;this.form.barcodeContent = "".concat(this.form.barcodeType, '-', this.form.bussinessCode);}},//装箱单选择handleSelectPackage() {this.$refs.packageSelect.showFlag = true;},/**选择装箱单返回 */onPackageSelected(obj) {if (obj != undefined && obj != null) {this.form.bussinessId = obj.packageId;this.form.bussinessCode = obj.packageCode;this.form.bussinessName = obj.clientName;this.form.barcodeContent = "".concat(this.form.barcodeType, '-', this.form.bussinessCode);}},/**选择工作站 */handleWorkstationSelect() {this.$refs.wsSelect.showFlag = true;},/**工作站选择返回 */onWorkstationSelected(obj) {if (obj != undefined && obj != null) {this.form.bussinessId = obj.workstationId;this.form.bussinessCode = obj.workstationCode;this.form.bussinessName = obj.workstationName;this.form.barcodeContent = "".concat(this.form.barcodeType, '-', this.form.bussinessCode);}},/*** 选择库存 */handleMaterialStockSelect() {this.$refs.stockSelect.showFlag = true;},/**库存选择返回 */onMaterialStockSelected(obj) {if (obj != undefined && obj != null) {this.form.bussinessId = obj.materialStockId;this.form.bussinessCode = obj.itemCode;this.form.bussinessName = "".concat(obj.itemName, '|', obj.specification, '|', obj.vendorName, '|', obj.batchCode);this.form.barcodeContent = "".concat(this.form.barcodeType, '-', this.form.bussinessId);}},handleConfig() {this.$refs.barcodeconfig.showFlag = true;},handleBatchPrint() {this.$refs.barcodebatchprint.showFlag = true;}}
};
</script>
<style scoped>
.barcodeClass {width: 100px;height: 200px;
}.barcodeFormClass {width: 200px;height: 200px;
}
</style>

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

代码随想录算法训练营第四十二天|01背包问题、416. 分割等和子集

动态规划 文章目录 一、01背包问题二、分割等和子集总结 一、01背包问题 1.在有限的背包内放入最高价值的东西 2.二维数据和一维数据都可以解决 3.二维数据&#xff0c;递推公式为dp[i][j] max(dp[i-1][j], dp[i-1][j-weight[i]]value[i])&#xff0c;分为两个状态&#xff0…

Towards Street-Level Client-Independent IP Geolocation(2011年)(第一部分)

被引次数:306 Wang Y, Burgener D, Flores M, et al. Towards {Street-Level}{Client-Independent}{IP} Geolocation[C]//8th USENIX Symposium on Networked Systems Design and Implementation (NSDI 11). 2011. Abstract 一个高度精确的客户端独立的地理定位服务将是互联…

箭头函数有哪些不适用场景

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

hyperf 二十九 修改器 二

教程&#xff1a;Hyperf 属性类型转换 Hyperf\Database\Model\Concerns\HasAttributes::casts被HasAttributes::setAttribute()、HasAttributes::getAttribute()调用&#xff0c;执行类型转换。 HasAttributes::casts为数组类型可设置基本类型或类的实例。默认设置主键id为int…

元类的执行

class MetaB(type):def __new__(cls, name, bases, attrs):print(f"使用元类 {cls.__name__} 创建{name}类 ")return super().__new__(cls, name, bases, attrs)class A(metaclassMetaB):passclass C(A):pass元类MetaB的__new__方法应该只会在创建类A时被调用一次, 因…

数据类型(基本数据类型和引用数据类型)

数据类型分为两种&#xff1a;基本数据类型和引用数据类型。 基本数据类型 有哪些&#xff1a;byte&#xff0c;short&#xff0c;int&#xff0c;long&#xff0c;float&#xff0c;double&#xff0c;char&#xff0c;boolean 整数类型&#xff1a;byte&#xff0c;short&a…

单例模式五种写法

单例模式五种写法 单例模式有五种写法&#xff1a;饿汉、懒汉、双重检验锁、静态内部类、枚举. 单例模式属于设计模式中的创建型模式 一、单例模式应用场景 windows的task manager(任务管理器)就是很典型的单例模式; windows的recycle bin(回收站)也是典型的单例应用&#…

Composer是什么?

Composer是PHP的一个依赖管理工具&#xff0c;它允许开发者声明项目所依赖的代码库&#xff0c;并在项目中自动安装这些依赖。它使用composer.json文件来定义项目的依赖关系&#xff0c;并使用composer.lock文件来锁定依赖的版本&#xff0c;以确保项目的稳定性和可重复性。 Co…

物联网的核心价值是什么?——青创智通

工业物联网解决方案-工业IOT-青创智通 物联网&#xff0c;这个词汇在当今的科技领域已经变得耳熟能详。但当我们深入探索物联网的核心价值时&#xff0c;我们会发现它远不止是一个简单的技术概念&#xff0c;而是一种能够彻底改变我们生活方式和工作方式的革命性力量。 物联网…

debian12.5国内镜像源配置清单

Debian 12.5在中国国内的镜像源清单&#xff0c;以及如何配置/etc/apt/sources.list文件的详细步骤&#xff1a; 1. 清华大学开源软件镜像站&#xff1a; - 替换/etc/apt/sources.list文件中的Debian默认源地址为清华大学的镜像地址。例如&#xff1a; deb https://mirrors.tu…

力扣周赛392复盘

3105. 最长的严格递增或递减子数组 题目 给你一个整数数组 nums 。 返回数组 nums 中 严格递增 或 严格递减 的最长非空子数组的长度。 思考&#xff1a; 返回什么&#xff1a;返回最长非空子数组的长度。return max(decs_len,incs_len); 但实际上我们只需要用一个变量ans就…

unity socket udp 连接

使用此方法有助于udp在局域网内稳定的连接运行&#xff0c;已经过验证&#xff0c;为了保持彻底的稳定&#xff0c;可以考虑加入ping-pang进行网络处理&#xff0c;如果为了安全&#xff0c;请使用加密TCP 如果您要在大规&#xff0c;大项目的游戏中使用网络技术&#xff0c;建…

[leetcode] max-area-of-island

. - 力扣&#xff08;LeetCode&#xff09; 给你一个大小为 m x n 的二进制矩阵 grid 。 岛屿 是由一些相邻的 1 (代表土地) 构成的组合&#xff0c;这里的「相邻」要求两个 1 必须在 水平或者竖直的四个方向上 相邻。你可以假设 grid 的四个边缘都被 0&#xff08;代表水&…

Java | Leetcode Java题解之第22题括号生成

题目&#xff1a; 题解&#xff1a; class Solution {static List<String> res new ArrayList<String>(); //记录答案 public List<String> generateParenthesis(int n) {res.clear();dfs(n, 0, 0, "");return res;}public void dfs(int n ,int…

牛客网刷题 | BC51 及格分数

描述 KiKi想知道他的考试分数是否通过&#xff0c;请帮他判断。从键盘任意输入一个整数表示的分数&#xff0c;编程判断该分数是否在及格范围内&#xff0c;如果及格&#xff0c;即&#xff1a;分数大于等于60分&#xff0c;是输出“Pass”&#xff0c;否则&#xff0c;输出“…

2024.4.13 蓝桥杯软件类C++B组山东省赛 小记

大三老狗了 &#xff0c; 还是把精力放在考研上了 &#xff0c;所以只是蓝桥杯的前一晚上把常用算法翻了翻。 其实还做了一场小模拟&#xff0c;两个题分值200分我狂砍了17分&#xff0c;bfs写半小时写不明白&#xff0c;所以晚上已经是心如死灰了&#xff0c;所以就早早睡觉了…

腾讯春招必看:2024最全Spring GraphQL面试题大全,掌握现代API技术!99%的应聘者都推荐收藏!

在2024年&#xff0c;随着API技术的快速演进和数据驱动应用的日益普及&#xff0c;GraphQL作为一种高效、灵活的API查询语言&#xff0c;已成为许多开发者和企业的首选。腾讯&#xff0c;作为全球领先的科技公司之一&#xff0c;对其开发团队的技术要求极高&#xff0c;特别是在…

【2024-04-15】虾皮春招笔试三道编程题解析

恭喜发现宝藏!搜索公众号【TechGuide】回复公司名,解锁更多新鲜好文和互联网大厂的笔经面经。 作者@TechGuide【全网同名】 订阅专栏: 【专享版】2024最新大厂笔试真题解析,错过必后悔的宝藏资源! 第一题:LOL买英雄 题目描述 用金币购买英雄联盟英雄的最大个数,要求给…

利用vite创建vue项目

创建vue项目步骤 打开HBuilder X工具&#xff0c;创建空白项目 进入终端(鼠标点击文件进行选择&#xff0c;然后终端) 利用vite脚手架创建项目 &#xff08;前提要将HBuilder X工具属性设为管理员运行状态&#xff08;属性》兼容》管理员身份运行此程序&#xff09; npm …

Android平台uni原生插件开发

uni原生插件开发&#xff1a;简介 | uni小程序SDK Android平台uni原生插件开发文档&#xff1a;开发者须知 | uni小程序SDK