- 博客(33)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 Rust 使用控制流循环访问代码 (if/else, while, loop, for循环)
1.if/else 表达式fn main() { if 1 == 2 { println!("哎呀，你的数学捞啊"); } else { println!("没错！1不等于2"); }}在前述示例中，if 的条件是表达式 1 == 2，该表达式的计算结果为布尔值类型，值为“false”。...
2021-05-31 17:39:47
408
原创 Rust 哈希映射练习题
1.练习问题在本练习中，你将需要以哈希映射的形式定义一篮水果。 键表示水果名称。 值表示篮中有多少指定的水果。需要在篮中至少放入三种不同类型的水果。 举例来说，这三类水果可以是苹果、香蕉和田螺。 水果总数不得少于五。2.代码use std::collections::HashMap;fn fruit_basket() -> HashMap<String, u32> { let mut basket: HashMap<String, u32> = HashMa
2021-05-31 16:18:24
196
原创 Rust 哈希映射的基本使用方法
学习Rust是为了什么？答案是：只是为了好玩fn main() { use std::collections::HashMap; let mut book_reviews: HashMap<String, String> = HashMap::new(); // Add book reviews book_reviews.insert( "Adventures of Huckleberry Finn".to_string(),
2021-05-26 10:28:55
307
原创 使用vue实现按钮的切换（vue tab切换）
1.效果图2.代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>测试vue</title> <script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script> </head>
2021-05-24 15:21:06
2547
转载 Vue使用element-ui tab切换echarts解决宽度100%问题
element-ui 使用el-tab组件注意事项 这里面每一个tab页使用echarts都会存在echarts设置百分比自适应问题设置100%后只有100px的样子缩到一起，解决办法是： 1. 第一种 解决：通过 v-if 重新渲染组件即可。 2. 延...
2021-05-20 17:31:58
830
原创 vue 实现双向绑定的核心方法：Object.defineProperty()
在vue中我们经常使用到 v-model ，但是 v-model 在vue里又是怎么实现的呢？在这其中最核心的就是使用了 Object.defineProperty 来实现vue的双向绑定。当然在这里我们不讨论vue实现 v-model 的源码，只浅析 Object.defineProperty 使用方法。1.什么是Object.defineProperty()Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。2.Objec
2021-05-12 12:21:31
279
转载 使用pdf.js实现pdf文件的在线预览（有码源）
博客更新地址啦～，欢迎访问：https://jerryyuanj.github.io/ 最近做移动项目（H5）时遇到一个需求，就是在线预览pdf文件。其实本来使用window.open()就可以实现了，但是这个API在IOS上是正常的打开Safari浏览器进行预览，在安卓上打开是则是下载预览，客户不满意；而且在将该应用嵌入到钉钉微应用时，这个API在安卓设备上根本不起效果。于是在网上找到了这个插件，去官网摘了个例子，并且结合移动端的上下左右滑动滑动...
2021-04-29 17:30:29
2002
1
原创 不使用vue过滤器怎么实现在数字前面统一加美元符号？现在给出一个思路：使用标签模板字面量
1，代码function doll(strings, ...values){ return strings.reduce(function(s,v,idx){ if(idx > 0){ if(typeof values[idx - 1] == 'number'){ s += `$${values[idx - 1].toFixed(2)}`; }else{ s += values[idx - 1]; } } retu
2021-04-22 22:40:24
234
原创 使用vue 实现收起展开的过度动画（涉及element的源码）
1.需求需要实现的效果是：给一个列表添加收起展开的过度动画，但是只使用简单的vue transition代码（不是transition简单，是我不熟悉transition，所以只能写出来简单的过度效果）来实现动画效果一直做不到令人满意的效果，最后找到一段element框架码源的代码，终于实现了需要的效果2.代码新建一个js文件：expansion.js（名字可以随意写）const elTransition = '0.3s height ease-in-out, 0.3s padding-top ea
2021-04-16 12:29:20
1531
1
原创 使用svg画饼状图（进阶版）
1.效果图2.代码<template> <div class="bg"> <div class="pie" /> </div></template><script>export default { data() { return {} }, computed: {}, mounted() { this.getsvg() }, methods: { getsv
2021-03-31 12:23:08
741
原创 利用svg画饼状图（基础版）
1.效果图2.代码html<template> <div class="bg"> <svg viewBox="0 0 64 64"> <circle r="16" cx="32" cy="32" /> </svg> </div></template>css<style lang="scss" scoped>.bg{ width: 60%; height
2021-03-31 11:42:08
344
原创 利用css实现矩形切角和矩形弧形切角效果效果
1.效果图2.代码<style lang="scss" scoped>.bg-content { width: 200px; height: 200px; background: #58a; background: linear-gradient(135deg, transparent 15px, #58a 0) top left, linear-gradient(-135deg, transparent 15px, #58a 0)
2021-03-31 09:24:13
1433
2
原创 利用css画出vans棋盘格图案
1.效果图2.css代码<style lang="scss" scoped>.bg-content { width: 100%; height: calc(100vh - 50px); background: #eee; background-image: linear-gradient(45deg, #bbb 25%, transparent 0), linear-gradient(45deg, transparent 75%, #bbb 0), linea
2021-03-30 17:38:59
571
原创 vue 使用canvas画圆圈进度条
1.效果图最后出来的效果如上图所示，界面的构建是利用vue实现的，具体代码如下：2.代码<!-- --><template> <div> <div class="time-graph"> <div class="big">70</div> <div class="medium">20</div> <div class="small">10&l
2021-03-12 17:03:37
1200
原创 Promise
function fetchX() { return 2 + 3 } function fetchY() { return 3 + 4 } function add(xPromise, yPromise) { return Promise.all([xPromise, yPromise]).then(function(values) { console.log('第一步') ...
2021-03-01 21:52:49
102
原创 修改 Element table表格的背景颜色以及边框下划线样式（最终解！）
1效果图：能改成这种效果，可见我有多厉害，那到底有多厉害呢？举个栗子：就像小母牛生不出仔，牛逼坏了2前提条件：你的项目使用的是vue 和 scss实现：利用 深度作用选择器 也就是 ::v-deep，来进行样式穿透，进而对table的样式进行覆盖并且改成我们想要的样式HTML <div class="table-wrapper"> <el-table :data="tableData" height=
2021-01-07 12:08:58
4142
5
原创 vue 实现父组件执行指定事件后，向子组件传递参数或调用子组件的事件（$refs使用）
父组件：父组件<template> <div> <children ref="children" :formData="formData"></children> <button @click="handleSubmit">提交</button> </div></template><script> import children from './children.
2020-12-18 16:44:36
616
1
原创 JS 数据类型：对象入门 + 五连鞭实战
JS类型:在js这门语言当中一共有六种数据类型，同时也叫语言类型，分别为：stringnumberbooleannullundefinedobject在这之中进行进一步细分，那么string，number，boolean，null，undefined为简单基本数据类型，而相应的object就被称为复杂数据类型，其中object又包含了许多的对象子类型，这些子类型包括我们常见的Function,Array,Object等。但是这并不是全部，Object完整的对象子类型分别有：StringN
2020-11-24 22:09:08
192
原创 解读vue-element-admin登录逻辑permission.js
import router from './router'import store from './store'import { Message } from 'element-ui'import NProgress from 'nprogress' // progress barimport 'nprogress/nprogress.css' // progress bar styleimport { getToken } from '@/utils/auth' // get token fro
2020-10-29 09:14:30
5216
原创 Vue Router 如何通过v-for的方式循环出简单的路由
1router -> index.vue文件import Vue from 'vue'import VueRouter from 'vue-router'/* Layout */import Layout from '@/layout'Vue.use(VueRouter)export const routes = [ { path: '/safety', redirect: '/safety', component: Layout, children
2020-10-23 15:40:11
2185
原创 vue Element 利用Cascader 级联选择器实现三层选择器
在这次项目需求中要实现的功能和选择地址的过程是很相似的，就用选择地址的过程来举例：首先是选择省，然后是市，再是某个区。在实际的开发过程中这种场景是很常见的，所以我就分享一下我的实现过程。效果图实现过程实现这个功能需要用到Element这个框架中的Cascader 级联选择器，但是不是那个Cascader 级联选择器都适用于这种场景，其中我选择了Cascader 级联选择器中的动态加载选择器，链接 --> 添加链接描述这个选择器的好处就像你看到的那样它可以：动态加载，这也就意味着可以把我们的数
2020-10-22 11:18:32
2321
2
原创 Element 利用Tooltip提示框实现动态显示文字提示
利用element的提示框来实现动态显示循环的数据，效果图如下：这里的四个项都是通过循环数组来展示出来的，需要用Tooltip提示框将代码包裹起来就可以达到此效果，代码如下：HTML:<div v-for="(item,index) in choice" :key="index" class="equipmentname center2"> <i class="el-icon-circle-close" style="margin:0 10px 0 1
2020-09-28 12:28:57
9350
原创 JS 利用vue过滤器将阿拉伯数字转化为汉字
<div class="deviceArea-item-title">设备{{index+1 | numberfilter}}</div> filters: { // 将阿拉伯数字转换为汉字的算法 numberfilter: function (num) { const changeNum = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'] // changeNum[0] = "零" .
2020-09-15 15:46:15
1768
原创 vue 将多个过滤器封装到一个文件中
在这里只简单探讨关于如何将vue过滤器封装到一个文件当中，当然可以封装多个不同类型的过滤器，然后可以在需要使用过滤器的文件当中进行复用，非常的方便。1.首先是文件结构，首先涉及到 filters.vue (引用过滤器的文件)文件代码：<template> <div class="chart-container"> <ul> <li v-for="texts in text" >{{texts | MoneyFormat}}&
2020-09-03 17:39:43
306
原创 ECharts图表自适应浏览器窗口大小（可随浏览器窗口的放大缩小而自适应）
2020年9月3今天在制作ECharts图表时遇到一个问题，需要在一个页面里放入十个ECharts图表，使用的是vue框架进行制作，为了避免在一个文件里写入过多的代码，于是每一个ECharts图表我都单独的写到另一个文件里，再通过组件的形式插入到主文件里。但是在制作折线图时因为这三个折线图在浏览器窗口里占的比例比较大，所以我就希望这些折线图能够在浏览器窗口缩放时进行自适应。**1.**当只有一个图表需要进行自适应时 // 使用刚指定的配置项和数据显示图表。 this.myChart
2020-09-03 15:57:53
3708
原创 力扣 两个列表的最小索引总和---题解
题目如图所示，在力扣的题库当中属于简单的类型，解题的方式是利用哈希表求解。/** * @param {string[]} list1 * @param {string[]} list2 * @return {string[]} */var findRestaurant = function(list1, list2) { let map = new Map(); ...
2020-04-24 16:10:00
123
1
原创 使用Axios替代vue-resource 1
这篇博文主要是简述利用Axios来进行数据请求的三种方式：首先你得有一台电电电电脑，开玩笑的。首先你得有一定的关于Vue的基础，然后很简单我们需要在我们的工程里，安装axios依赖包，只要在终端命令输入“npm install --save axios”进行下载axios依赖包即可。第一种直接在你需要请求数据的界面请求数据即可（局部请求），以下是相关的JS代码（bank.vue）<...
2019-11-25 16:53:25
216
原创 微信小程序实现下拉刷新之利用滚动视图区域"scroll-view"实现
微信小程序利用scroll-view滚动视图区域实现下拉刷新，其实是利用了scroll-view里的bindscrolltoupper（滚动到顶部/左边时触发）属性，在一个可上下拖动的滚动视图区域里，当我们拖动到视图的顶部时就会触发bindscrolltoupper这个属性，这时我们可以绑定一个事件，比如：然后当触发了bindscrolltoupper这个属性时，就会执行事件处理函数"u...
2019-06-22 12:30:28
3980
2
原创 微信小程序实现上传照片到服务器，包含删除照片预览照片等功能
giao！实现上传照片到服务器,包含删除照片预览照片功能，以及限制上传照片数量。效果图：post.jsconst app = getApp()var form_data; var psw_vaule = []; Page({ data: { tempFilePaths: [], img_arr: [], }, //上传图片到服务器 form...
2019-06-16 20:28:04
2119
2
原创 微信小程序实现用form表单包裹输入的数据并上传到服务器
两个输入框分别为input与textarea，然后用form表单包裹两个输入框所输入的数据，再上传到服务器，效果图：post.wxml<form bindsubmit="formSubmit" bindreset="formReset"> <view style='position: fixed; width: 100%;'> <input...
2019-06-16 19:31:04
7394
3
原创 wifi小车的制作（基于51单片机,含代码）
之前心血来潮花了近一个月制作了一台WiFi小车，功能不复杂主要是实现小车的前进后退与左右转弯。小车主要组成有四大部分：1. 51单片机2.电机驱动模块3.wifi模块4.车身主体51单片机只要用51单片机最小系统即可，可以自己制作也可以上淘宝买现成的零部件。电机驱动模块主要是用于给电机供给稳定的电压，同时电机也是通过驱动模块与51单片机相连，进而能通过51单片机控制电机的正转与反转。...
2019-06-04 13:01:57
7184
10
原创 微信小程序开发之页面传值
微信小程序开发之页面传值，主要是讲对象传值。发送界面：Page({ data: { comment:{name:'username', password:'password'} },onTouch: function(event) { console.log(event) wx.navigateTo({ url: '...
2019-06-03 13:29:08
572
空空如也
工作一年的小白前端，不知道是否要继续留在公司
2021-05-21
TA创建的收藏夹 TA关注的收藏夹
TA关注的人