Rayong有分享-CSDN博客

原创 Quasar中tree获取数据后默认展开和默认选中

文章目录一、html代码以及解释如下二、js具体的代码：三、效果图如下要实现默认展开和默认选中效果，只要初始化的时候给id值和等待数据获取后再进行tree渲染即可。一、html代码以及解释如下<q-tree v-if="initFlag" :nodes="networkData" node-key="id" label-key="name" children-key="organizationList" v-model:selected="selected" no-connect

2021-11-16 14:06:28 1918 1

原创 Quasar之q-tree选择节点

话不多说，直接上代码。 <q-tree :nodes="testData" node-key="label" default-expand-all v-model:selected="selected" no-connectors @click="handleClick" />备注：default-expand-all- -初次渲染展开全部节点no-connectors- -无连接线v-model:selected=“selected”- -选

2021-11-03 10:49:03 1907 3

原创 Quasar中q-select中的事件触发

前提：项目是quasar结合vue3.0进行开发。要实现q-select中改变下拉框选项触发函数，查看Quasar v2文档可以发现,使用 @update:model-value=“”即可.项目中代码&效果如下： <q-select style="width:180px" class="my-select" v-model="table.selectNetwork" :options="table.selectOptions" outlin

2021-10-28 14:35:16 2266 1

原创 uni-app实现类似物流进度跟踪功能

文章目录1、物流进度跟踪的组件2、调用组件的页面3、页面的效果图1、物流进度跟踪的组件<template> <view class="steps"> <!-- <view class="steps_list"> <view class="node" :class="{'active-node':item.activity == item.index}"></view> <view class="tail" :cl

2021-09-17 10:45:31 2527

原创 uni-app实现生成二维码功能

文章目录1、生成二维码的组件2、调用页面的代码3、页面的效果图1、生成二维码的组件由于代码太多不便粘贴了，可以进入这里查看详情https://www.npmjs.com/package/tki-qrcode2、调用页面的代码 <tki-qrcode v-if="ifShow" cid="qrcode1" ref="qrcode" :val="val" :size="size" :unit="unit" :icon="icon" :iconSize="iconsize" :lv="lv" :

2021-09-17 10:18:16 4514 1

原创 uni-app实现扫描二维码功能

文章目录1、重点代码2、效果图3、总结1、重点代码 <view class="flex nfc-ewm"> <view class="nfc-ewm-item" style="border-right: 1px solid #ccc;" @click="testNFC"> <image src="@/assets/images/application/icon-nfc.png" alt=""></image>NFC感应 </view&

2021-09-17 10:04:53 4630

原创 uni-app实现NFC读取功能

好久没有写博客了，今天难得有空重新记录自己学习的点点滴滴。文章目录1、NFC方法.js2、在用NFC的页面调用方法3、页面效果图4、总结1、NFC方法.js// 包路径const package_NdefRecord = 'android.nfc.NdefRecord';const package_NdefMessage = 'android.nfc.NdefMessage';const package_TECH_DISCOVERED = 'android.nfc.action.TECH_DIS

2021-09-17 09:53:04 3855 5

原创 vue3.0中diff的优化和静态提升

最近因项目需求，开始补学vue3.0 ，总体感觉还不赖，组合API的强大，diff算法的更新，促使项目开发比以前快个一到两倍，体积也小了。众所周知，2020年9月18日尤雨溪发布了正式版VUE3。为了更直接的观看代码的优化。大家可以去这个网站测试了解熟悉。https://vue-next-template-explorer.netlify.app/例如：vue3.0中diff算法在创建虚拟DOM时候会根据内容可不可以变化来添加静态标记还可以在右上角进行勾选，查看更多优化地方。这里是勾选了静态提升

2021-03-11 20:54:45 576

原创 uni-app时间选择器只需要年月

今天做项目的时候碰到需求只需要年月，所以查找了一下资料，找到了解决方法。正常代码年月日时间选择器的代码是 <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange" > <view clas

2021-01-17 21:58:41 10298 8

转载 javascript删除数组元素的几个方法

javascript删除数组元素的7个方法文章目录一、length属性二、delete关键字三、pop()栈方法四、shift()队列方法五、splice()操作方法六、迭代方法七、prototype原型方法我在写代码中，碰到了要在forEach中找到符合条件的数据进行删除，但是由于每次匹配到符合条件的数据后使用splice，它不能完全实现我想要的效果，因为使用splice会改变数组长度，也会导致数组指针指向错误，所有导致有些符合要求的数据没有删除掉。所有我查找了一些删除数组元素的方法，发现filt..

2021-01-16 09:20:28 1063

原创 uni-app中三目运算的正确用法

最新写uni-app的项目，碰到要写三目运算，结果一直不成功，后面查资料得知原来uni-app中的使用方式有些许不同。在class中写三目运算要记得加一个中括号[] <view :class="[de_index == '-1' ? 'de-color' : '']">{{de_index == '-1' ? '请选择职务' : array[de_index]}}</view>补充：在style中写三目运算不是加[]，而是加()哦。 <view class="t

2021-01-04 15:55:40 4625

转载本地mysql 安装以及已启动

转载地址：https://blog.csdn.net/chic_data/article/details/72286329 环境：windwos 10（1511） 64bit、mysql 5.7.14 时间：2016年9月5日亲测非常有用一、下载mysql 1. 在浏览器里打开mysql的官网http://www.mysql.com/ 2. 进入页面顶部的"Downloads" ...

2020-12-15 22:22:11 526 2

原创启动mysql

1、首先要用管理员身份打开DOS窗口简单方法就是在搜索哪里搜cmd，然后找到命令提示符，右击选择以管理员身份运行，如下2、然后直接输入net start mysql即可开始启动mysql，如下另外两个相关的命令是：1、以管理员的权限 net stop mysql ，关闭mysql服务2、以管理员的权限 mysqld -remove ，卸载mysql服务...

2020-12-15 21:25:03 128 1

转载深入理解CSS选择器优先级

深入理解CSS选择器优先级题外话今天把《CSS REFACTORING》（中文名叫《CSS重构：样式表性能调优》）电子书粗略的浏览了一遍，这本书很薄，150页左右，首先是介绍了什么是重构并举了两个简单的重构例子，然后介绍了CSS的选择器优先级，再然后介绍了CSS的最佳实践，再然后就介绍如何重置浏览器的默认样式，最后比较虚的、纯理论的介绍了CSS重构的策略，然后就没有然后了。这书整体内容很简单，但是，其中对于 CSS选择器优先级计算作了比较深入的讲解。什么是...

2020-10-19 16:48:22 302

原创代码注释中经常用到的 TODO

起初我在做项目的时候，发现在看前辈的代码时候，经常可以看到TODO，当时我还没在意，后面发现多了，就好奇这是什么意思。“TODO ”的英文翻译为“to do” 。是表示这个地方还有一些事情要做，有一些代码要写的意思,也就是需要去做的事情，因为用了这个注释，不少 IDE 和文本编辑器会对 TODO额外做些高亮显示，在代码中很明显，所以作为程序员在编写代码时给自己留这个备忘。所以以后写代码的时候可以养成习惯在你觉得代码还有待完善的地方备注一下TODO吧。另外，还有两个常用的注释FIXME（待修正）、X

2020-08-21 16:45:17 7680 1

原创 vant之van-list的使用以及一些坑的解决方式

文章目录第一步，要使用vant组件，安装好vant，npm i vant -S第二步，在你要用到的地方js中引入，或者在src/main.js里面引入第三步，在template中引用第四步，js中重要代码第五步，解决遇到的坑第一步，要使用vant组件，安装好vant，npm i vant -S第二步，在你要用到的地方js中引入，或者在src/main.js里面引入import Vue from ‘vue‘;import { List } from ‘vant‘;Vue.use(List);这

2020-08-21 11:21:06 23707 11

原创 Element组件之分页的使用，特别是page-count的坑

首先分页的使用并不难，只要按照官方文档所写即可，但是里面还有有一些需要大家注意的。话不多说，先上代码<template> <div class="common_small_page"> <el-pagination small class="pop_small_page" background layout="prev, p

2020-07-23 17:35:31 9013 2

转载 Vue中this.$nextTick的作用及用法

Vue实现响应式后DOM的变化data对象中数据改变是如何追踪的?vue将遍历data对象中所有的属性，并通过 Object.defineProperty 把这些属性全部转为 getter/setter；但是我们是没有办法看到 getter/setter的，但是在内部它们让 Vue 能够追踪依赖，在属性被访问和修改时通知变更。每个组件都对应一个 watcher 实例，它会在组件渲染的过程中把“接触”过的数据属性记录为依赖。之后当依赖项的 setter 触发时，会通知 watcher，从而使它关联的

2020-07-14 16:54:37 1573

原创 Element表格之表头合并、行合并和列合并

文章目录一、合并表头二、合并表格行三、合并表格列最近写vue开发项目的时候，很多地方用到了Element组件中的Table 表格。经过一周的边学边做，我总结了以下三种有关表格的合并方法。一、合并表头话不多说，先看效果图：代码如下：表格结构如上，其中:header-cell-style对表头做了一些处理。 , headFirst({row, colunm, rowIndex, columnIndex}) { if (rowIndex === 1) {

2020-07-14 16:17:13 22468 11

原创有关Android studio 模拟器中输入中文

新手接触Android studio时候，碰到了模拟器它系统里不提供中文输入，于是我在自己的电脑里下载好中文输入法的apk，然后移动模拟器中即可下载好，接下来就是和正常手机一样设置输入法了。效果图：下载链接：http://apk.co/google-inc/google-pinyin-input-451164561151-x86-1...

2020-06-12 14:35:09 1007

原创微信小程序之页面中关于聊天框三角形的制作和使用

我最近需要写一个消息通知的页面，需要用到聊天框来展示通知信息。那么那个聊天框该怎么做呢？我有三种方式可以实现。方法一：使用三角形的图片，定位在文本的左侧。代码如下：wxss部分：.Angle { display: flex; align-items: center; z-index: 10; position: absolute; top: 10rpx; left: -5rpx; }效果图为：该方法不好用的地方是，不可以给它加边框颜色，因为它是一张图片，没有

2020-06-04 11:09:19 2858

原创微信小程序之自定义tabBar及切换不同版本显示不同tabBar

今天，我在写页面的时候，碰到需要切换不同身份（两个版本）时候底部tabBar显示不同，我的解决方法是：首先在components（组件模板）下新建一个tabBar.wxml:<template name="tabBar"> <view class="tab-bar" style="color: {{tabBar.color}}; background: {{tarBar.backgroundColor}}; {{tabBar.position=='top'? 'top: 0

2020-05-11 23:18:52 2616 9

原创微信小程序之自定义顶部导航栏

首先创建一个components的模板组件文件夹，里面放上我的顶部自定义模板。如图：写好自定义组件后，记得在每个页面的.json中加上：{ "usingComponents": { "navbar": "/components/navbar/navbar" //组件的位置 }, "navigationStyle": "custom"}引用组件的每个页面的wxml加上：<navbar navTitle="请假条" back home></navbar&gt

2020-05-09 22:12:52 1067

原创 a标签注意的那些事

javascript: 是一个伪协议，它是表示在触发默认动作时，执行一段JavaScript代码。而 javascript:; 表示什么都不执行，这样点击时就没有任何反应。href="javascript:;"就是去掉a标签的默认行为，它跟href="javascript:void(0)"用法是一样的现在对a标签进行分析：1.首先标签中有name属性或是href属性，那么它就可以起作用了；2.其次标签若想有类似链接的效果，比如下划线或者是手状的鼠标等，就需要有href属性；3.有的人会使用href

2020-05-08 22:19:58 211

rayong的博客