<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Heyuner的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Heyuner</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Heyuner]]></copyright><item><title><![CDATA[Vue3-element-admin]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/142493815</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/142493815</guid><author>Heyuner</author><pubDate>Tue, 24 Sep 2024 16:39:16 +0800</pubDate><description><![CDATA[vue3-element-admin]]></description><category></category></item><item><title><![CDATA[Git 的基本概念和使用方式]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/132561669</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/132561669</guid><author>Heyuner</author><pubDate>Tue, 29 Aug 2023 14:59:15 +0800</pubDate><description><![CDATA[在本地 Git 仓库中添加文件并进行修改，使用 git add 命令将修改后的文件添加到暂存区，使用 git commit 命令将文件提交到本地 Git 仓库中。和其他开发者协作开发，需要先从远程 Git 仓库中拉取最新代码，使用 git pull 命令拉取最新代码。推送到远程 Git 仓库，可以使用 git push 命令将本地项目代码上传到远程 Git 仓库。提交（Commit）：是指将修改后的文件版本提交到本地 Git 仓库或者远程 Git 仓库。创建分支，分别进行开发，然后合并到主分支上。]]></description><category></category></item><item><title><![CDATA[Docker的优势]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/132561615</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/132561615</guid><author>Heyuner</author><pubDate>Tue, 29 Aug 2023 14:57:47 +0800</pubDate><description><![CDATA[容易部署和管理：Docker的部署和管理非常容易，可以使用Dockerfile来定义镜像的构建过程，使用Docker Compose来描述应用程序的部署配置。持续集成和部署：Docker容器可以用来运行持续集成和部署的工作流，将代码构建成镜像并将其推送到仓库，最后在不同的环境中部署容器。它是Docker容器的基础。开发环境管理：Docker容器可以用来搭建应用程序的开发环境，保证每个开发人员使用的环境都是一致的。容器：Docker容器是一个可隔离的、可移植的运行环境，可以在任何地方运行Docker镜像。]]></description><category></category></item><item><title><![CDATA[mapbox-gl画圆注意事项]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/131640123</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/131640123</guid><author>Heyuner</author><pubDate>Mon, 10 Jul 2023 15:34:50 +0800</pubDate><description><![CDATA[首先，要实现地图上按照一定距离（米）画圆，需要使用mapbox-gl的表达式功能（expressions），首先找到墨卡托坐标距离和屏幕上的像素换算公式。根据函数，传入圆的地理距离和圆中心点所在的纬度坐标，计算地图缩放到20级时，圆在屏幕上的像素尺寸。circle-radius 那里用stops。]]></description><category></category></item><item><title><![CDATA[mapbox自定义图标]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/128233217</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/128233217</guid><author>Heyuner</author><pubDate>Thu, 08 Dec 2022 11:00:21 +0800</pubDate><description><![CDATA[mapbox自定义图标]]></description><category></category></item><item><title><![CDATA[vue3 配置数据用于for循环遇到的坑]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/127920991</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/127920991</guid><author>Heyuner</author><pubDate>Tue, 22 Nov 2022 14:47:51 +0800</pubDate><description><![CDATA[比如需要循环一堆CheckBox，为了少在template里写代码，需要配置一组数据循环一下，配置里面包括CheckBox需要绑定的值，CheckBox group需要绑定的值，以及绑定的change事件等，有两层循环，这时最里面的循环绑定的值失去了响应性，导致CheckBox选不上。这个配置写成响应式的，即最外层包裹ref。]]></description><category></category></item><item><title><![CDATA[H5页面上拉加载更多，下拉加载最新数据，及Chrome测试]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/123207603</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/123207603</guid><author>Heyuner</author><pubDate>Tue, 01 Mar 2022 15:49:28 +0800</pubDate><description><![CDATA[下拉加载最新数据：使用pulltorefreshjs插件，具体用法参考：pulltorefreshjs - npm



底部上拉加载更多：

文档的高度 - 被卷走的高度 - 可视区域的高度 &lt; 某个值（自己设置）

文档的高度：document.body.scrollHeight

被卷走的高度:document.body.scrollTop

可视区域的高度:document.body.clientHeight



Chrome如何测试下拉：打开F12，点击第二个手机的图标，中间选一个手机端的]]></description><category></category></item><item><title><![CDATA[React脚手架项目中的小tips]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118444572</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118444572</guid><author>Heyuner</author><pubDate>Sat, 03 Jul 2021 21:03:17 +0800</pubDate><description><![CDATA[1.引入css可以模块化

    注意文件命名，如xxx.module.css









2.配置多个代理需要在src下新建一个固定名字的文件夹



该文件里的代码写法如下：


const proxy = require("http-proxy-middleware")
module.exports = function(app){
    app.use(
        proxy('/api1',{
            target:"http://localhost:500...]]></description><category></category></item><item><title><![CDATA[Vue 哪些数组的方法是响应式的？]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118444230</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118444230</guid><author>Heyuner</author><pubDate>Sat, 03 Jul 2021 20:09:08 +0800</pubDate><description><![CDATA[因为vue是响应式的，所以当数据发生变化时，vue会自动检测数据的变化，视图会发生对应的更新。

vue中包含了一组观察数组编译的方法，使用他们改变数组也会触发视图的更新。


push() //往数组最后添加元素
pop() //删除数组中最后一个元素
shift() //删除数组中第一个元素
unshift() //在数组最前面添加元素
splice() //删除元素/插入元素/替换元素
    splice(start,length,元素)
    删除元素：第二个参数传入你要删除几个元素（如果没有传]]></description><category></category></item><item><title><![CDATA[Vue过渡与动画（二）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118345509</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118345509</guid><author>Heyuner</author><pubDate>Tue, 29 Jun 2021 23:03:43 +0800</pubDate><description><![CDATA[2.通过JS钩子来设置元素进入和离开的过渡效果

transition的事件处理


//事件


before-enter
before-leave
before-appear
enter
leave
appear
after-enter
after-leave
after-appear
enter-cancelled
leave-cancelled（v-show only）
appear-cancelled


//添加默认样式名，:css="true",就是v-enter那些
&lt;...]]></description><category></category></item><item><title><![CDATA[Vue过渡与动画（一）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118345025</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118345025</guid><author>Heyuner</author><pubDate>Tue, 29 Jun 2021 22:30:53 +0800</pubDate><description><![CDATA[1.通过样式设置元素进入和离开过渡的效果

transition组件（给一个元素添加过渡效果）
	通过样式设置元素进入和离开过渡的效果
	

.v-enter
.v-enter-active
.v-enter-to

.v-leave
.v-leave-active
.v-leave-to



&lt;template&gt;
    &lt;div&gt;
        &lt;transition&gt;
            &lt;div v-if="flag" class="box"&gt;]]></description><category></category></item><item><title><![CDATA[jq插件（答题专注模式）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118329620</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118329620</guid><author>Heyuner</author><pubDate>Tue, 29 Jun 2021 10:59:54 +0800</pubDate><description><![CDATA[(function ($) {
	$.hhh= $.hhh|| {}
	$.hhh.oneByOne = function (options) {
		this.defaults = {
			formWidgets: $(".form-section article.form-widget"),//获取所有题目
			widgetsWrap: $(".content-wrap"),//表单内容的wrap，用于设置margin
			widgetParentNode: $(".form-section").]]></description><category></category></item><item><title><![CDATA[flex-basis和width的区别]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118314762</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118314762</guid><author>Heyuner</author><pubDate>Mon, 28 Jun 2021 23:37:34 +0800</pubDate><description><![CDATA[]]></description><category></category></item><item><title><![CDATA[JS 常用方法汇总（三）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118157119</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118157119</guid><author>Heyuner</author><pubDate>Wed, 23 Jun 2021 17:08:01 +0800</pubDate><description><![CDATA[1、n-m之间的随机数


function numRandom(n, m) {
        if (n &gt; m) {
            return parseInt(m + Math.random() * (n - m + 1));
        } else {
            return parseInt(n + Math.random() * (m - n + 1));
        }
}


2、时间过滤器 yyyy-mm-dd hh:mm:ss


filter]]></description><category></category></item><item><title><![CDATA[JS 常用方法汇总（二）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118156303</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118156303</guid><author>Heyuner</author><pubDate>Wed, 23 Jun 2021 16:59:33 +0800</pubDate><description><![CDATA[Math

Math本身就是一个对象, 不需要在通过构造函数去创建, 该对象中集合了很多关于数学运算的方法

Math.abs() 获取一个对象的绝对值

Math.round() 四舍五入

Math.PI π

Math.max() 求几个数的最大数

Math.min() 求几个数的最小数

Math.ceil() 向上取整

Math.floor() 向下取整

Math.random() 随机数 (随机生成0 ~1之间的数)


//应用例子
var arr = [1,3,5,7,9,2,90,6]]></description><category></category></item><item><title><![CDATA[JS 常用方法汇总（一）]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118146753</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118146753</guid><author>Heyuner</author><pubDate>Wed, 23 Jun 2021 11:36:06 +0800</pubDate><description><![CDATA[除数取整：

1.只保留整数部分：parseInt(5/2)

2.向上取整,有小数就整数部分加1：Math.ceil(5/2)

3,四舍五入：Math.round(9/2)

4,向下取整：Math.floor(5/2)

保留小数几位

toFixed(2)



大小写：

1.使字符串全部变为小写：toLowerCase() \toLocaleLowerCase()

2.使全部字符变为大写：toUpperCase() \toLocaleUpperCase()

toLowerCase() 和..]]></description><category></category></item><item><title><![CDATA[jstree contextmenu的增删改等操作在节点后加一个图标点击显示]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/118144499</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/118144499</guid><author>Heyuner</author><pubDate>Wed, 23 Jun 2021 10:10:10 +0800</pubDate><description><![CDATA[jstree官网：https://www.jstree.com.cn/api.html#/?f=toggle_node(obj)

jstree的GitHub地址：https://github.com/vakata/jstree，https://github.com/vakata/jstree/wiki



标题所说的操作就是要加插件，写法类似这个，也有点不一样


(function ($) {
           "use strict";
            //自己自定义图标，点这个图标出现]]></description><category></category></item><item><title><![CDATA[React学习（从零基础到精通）00011001]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/117914267</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/117914267</guid><author>Heyuner</author><pubDate>Mon, 14 Jun 2021 22:58:17 +0800</pubDate><description><![CDATA[DOM的Diffing算法


&lt;script type="text/babel"&gt;
	/*
      1). react/vue中的key有什么作用？（key的内部原理是什么？）
      2). 为什么遍历列表时，key最好不要用index?
      
			1. 虚拟DOM中key的作用：
					1). 简单的说: key是虚拟DOM对象的标识, 在更新显示时key起着极其重要的作用。

					2). 详细的说: 当状态中的数据发生变化时，react会根据【新数据】生成【新]]></description><category></category></item><item><title><![CDATA[React学习（从零基础到精通）00011000]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/117914248</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/117914248</guid><author>Heyuner</author><pubDate>Mon, 14 Jun 2021 22:55:55 +0800</pubDate><description><![CDATA[getSnapshotBeforeUpdate钩子的使用场景


&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;getSnapshotBeforeUpdate的使用场景&lt;/title&gt;
    &lt;style&gt;
        .list{
            width: 200px;
            h]]></description><category></category></item><item><title><![CDATA[React学习（从零基础到精通）00010111]]></title><link>https://blog.youkuaiyun.com/Heyuner/article/details/117914217</link><guid>https://blog.youkuaiyun.com/Heyuner/article/details/117914217</guid><author>Heyuner</author><pubDate>Mon, 14 Jun 2021 22:53:38 +0800</pubDate><description><![CDATA[react生命周期（新）


    &lt;script type="text/babel"&gt;
        /*
            1. 初始化阶段：由ReactDOM.render()触发----初次渲染
                        1.contructor()
                        2.getDerivedStateFromProps()
                        3.render()
                ]]></description><category></category></item></channel></rss>