<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[webfullstack的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/webfullstack</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; webfullstack]]></copyright><item><title><![CDATA[解释 RESTful API，以及如何使用它构建 web 应用程序。]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/132452566</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/132452566</guid><author>webfullstack</author><pubDate>Wed, 23 Aug 2023 14:57:25 +0800</pubDate><description><![CDATA[在客户端上，可以使用JavaScript等语言发起Http请求来调用API接口，并将返回的数据进行处理和展示，从而构建出完整的Web应用程序。RESTful API是一种利用HTTP协议进行通信的Web API设计风格，它采用了一组统一且可缓存的操作，包括GET、POST、PUT、DELETE等，通过URL来定位资源，以及使用JSON、XML等格式来传输数据，以实现系统之间的数据交互和资源共享。对于每个请求，服务器将返回对应的HTTP状态码和表示资源的数据，客户端将据此进行相应的处理。]]></description><category></category></item><item><title><![CDATA[elementUI的日期选择器携带至今的临时方案]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/123005291</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/123005291</guid><author>webfullstack</author><pubDate>Fri, 18 Feb 2022 16:41:40 +0800</pubDate><description><![CDATA[在ElementUI的el-date-picker组件中添加至今选项

提示：以下是本篇文章正文内容，下面案例可供参考

思路：通过判断点击的 至今 按钮给当前行添加一个is_to_date状态字段,
这个is_to_date有以下功能:用于控制当前的日期选择器是否是必填,用于控制placeholder显示 至今 这个字符
给当天的日期组件添加修改placeholder样式的className

]]></description><category></category></item><item><title><![CDATA[elDatePicker动态限制选择特定日期范围]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/115343697</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/115343697</guid><author>webfullstack</author><pubDate>Wed, 31 Mar 2021 10:43:53 +0800</pubDate><description><![CDATA[需求场景复现(需要安装dayjs插件):

使用时间范围组件el-date-picker其type="daterange"
时间组件的选择下拉框展开时,时间可以任意选择.
用户点击了第一次,出现选择范围,目前是一个月(也就是当前选中的日期,前后一个月之内都是可选的,大于或小于时间范围的都不可选中)
如果用户第二次点开,时间范围不可选的限制要取消

// 平常使用的版本
// html部分
&lt;el-date-picker
   v-model="params.receiving_time"
   typ]]></description><category></category></item><item><title><![CDATA[[vue][element-ui][el-table]控制表格的滚动条滑动到最右边]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/114625272</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/114625272</guid><author>webfullstack</author><pubDate>Wed, 10 Mar 2021 09:28:39 +0800</pubDate><description><![CDATA[场景复现
表格宽度过长产生了横向的滚动条,实行当前页的编辑时会触发表格的数据重新渲染,重新渲染时,会降滚动条拉到最左边,这就就要在列表动态渲染完之后,将滚动条拉回最右边
方法
refs[‘tableList’]上有一个bodyWrapper里面有scrollLeft 属性,可以设置表格左滑动的距离为整个表格的宽度,而表格的宽度在refs[‘tableList’].bodyWidth,替换字符串和变数字以后就可以了
JS部分
this.$nextTick(()=&gt;{
  this.$refs.table]]></description><category></category></item><item><title><![CDATA[[van-dropdown-menu] 下拉菜单倒三角对不齐的优化方案]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/112020031</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/112020031</guid><author>webfullstack</author><pubDate>Thu, 31 Dec 2020 16:08:12 +0800</pubDate><description><![CDATA[场景复现:
使用到的方法(css的网格布局)
display:grid
实现步骤
项目场景：

终端: H5
框架:
"vant": "^2.11.2",

"vue": "^2.6.11",

H5页面上使用van-dropdown-menu组件出现了样式错位的问题

在文字溢出时出现样式问题,
文字没有达到溢出的条件时没有问题



问题描述：

van-dropdown-menu组件文字溢出时中遇到的问题：
下拉菜单倒三角对不齐

 

原因分析：

倒三角的定位,是根据父级元素做的定位,父级元素的宽]]></description><category></category></item><item><title><![CDATA[[Vant][Form+vanDropdownMenu]Vant的表单Form和下拉选择vanDropdownMenu的关联验证]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/111061462</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/111061462</guid><author>webfullstack</author><pubDate>Sat, 12 Dec 2020 15:10:31 +0800</pubDate><description><![CDATA[实现的效果图如下:

在使用vant的表单组件需要嵌套下拉选择组件vanDropdownMenu时的方式如下
一. HTML部分
&lt;van-form @submit="onSubmit" class="mlr-15"&gt;
    &lt;van-field
      v-model="form.id"
      label="试卷类型"
      error
      required
      :rules="[{ required: true, message: '请选择试卷类型' ]]></description><category></category></item><item><title><![CDATA[问题记录贴:Unexpected end of JSON input]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/110678577</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/110678577</guid><author>webfullstack</author><pubDate>Sat, 05 Dec 2020 11:21:18 +0800</pubDate><description><![CDATA[× Install fail! SyntaxError: Unexpected end of JSON input (file: D:\Code\ICode\Vue\vue_shop_api\node_modules_mime-types@2.1.27@mime-types\package.json)
SyntaxError: Unexpected end of JSON input (file: D:\Code\ICode\Vue\vue_shop_api\node_modules_mime-types@]]></description><category></category></item><item><title><![CDATA[如何在el-table中传递index到el-checkbox]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/108451116</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/108451116</guid><author>webfullstack</author><pubDate>Mon, 07 Sep 2020 16:53:01 +0800</pubDate><description><![CDATA[表格的多选传递scope.$index的传递方式
&lt;el-checkbox v-model="scope.row.show" :true-label="1" :false-label="0" @change="handleCheckItemChange(scope.row.show,scope.$index)"&gt;&lt;/el-checkbox&gt;

js部分
// 行级按钮事件
handleCheckItemChange (val, i) {
  console.log(val, i)
}]]></description><category></category></item><item><title><![CDATA[[日历组件][基于mpvue-calendar]自定可设置出勤信息的日历]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/107889965</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/107889965</guid><author>webfullstack</author><pubDate>Sun, 09 Aug 2020 10:15:16 +0800</pubDate><description><![CDATA[目前已经实现,可以自定义修改考勤信息,


实现原理, 一句话概括,把年和月传进mpvue-calendar组件中,再延时去值,拿到值之后就可以做其他的操作了  ^ + ^

基础的安装(一步带过,这是文档传送门)

npm i mpvue-calendar -S
页面再引入就可以
使用
import Calendar from ‘mpvue-calendar’ 引入组件
import ‘mpvue-calendar/src/style.css’ 引入样式文件(mpvue 小程序端)
components.]]></description><category></category></item><item><title><![CDATA[[Form Generator][一期替代方案]调用接口数据到opitions]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/107868204</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/107868204</guid><author>webfullstack</author><pubDate>Fri, 07 Aug 2020 18:29:25 +0800</pubDate><description><![CDATA[el-cascader的数据调用
设置新增私有属性 (private_: {assField: ‘’},) 需要每个组件里面都添加(位置组件config.js)
// 选择型组件 【左面板】
export const selectComponents = [
  {
    __config__: {
      private_: {assField: ''},

新增控制层的代码

代码位置RightPanel.vue(可以使用全局搜索RightPanel找位置)

&lt;el-form-item
 ]]></description><category></category></item><item><title><![CDATA[[element-ui] form的多个字段之间联动验证和取消验证]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/106387909</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/106387909</guid><author>webfullstack</author><pubDate>Wed, 27 May 2020 18:43:10 +0800</pubDate><description><![CDATA[目录字段: 去/返程日期(deptDate), 去/返程班次(flghtTrainSchedNo)HTML片段JS片段
字段: 去/返程日期(deptDate), 去/返程班次(flghtTrainSchedNo)

页面一进入时,都为非必填项,
逻辑出现必填的范围只有飞机和火车,汽车和自驾没有必填的验证
如果用户操作了,其中一项,两者都为必填
如果用户删除了一项且另一项无值时,变为非必填
如果先点击了飞机或火车再去点击汽车和自驾,则取消验证必填项
使用监听触发验证和取消验证

简单的描述: 两者一个有值时]]></description><category></category></item><item><title><![CDATA[[WeChart]微信小程序抓包步骤]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/105439151</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/105439151</guid><author>webfullstack</author><pubDate>Fri, 10 Apr 2020 18:34:49 +0800</pubDate><description><![CDATA[PC端: win10
Tools: whistle
小程序端: Iphone 8



安装Node(https://nodejs.org/)


安装whistle
npm install -g whistle或cnpm install -g whistle
如果cnpm不存在
npm install cnpm -g --registry=https://registry.npm.taobao...]]></description><category></category></item><item><title><![CDATA[[WeChat]关于小程序左上角的返回按钮事件的替换方案 - [有缺陷]]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/105314488</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/105314488</guid><author>webfullstack</author><pubDate>Sat, 04 Apr 2020 18:59:37 +0800</pubDate><description><![CDATA[写在前面, 由于小程序的左上角返回按钮事件,没有能直接用的方案(ps:我在官方文档上以及官方社区上没找到,望找到的大神告知,不胜感谢), 只能在事件逻辑上拦截,但是会产生一个体验度不好的缺陷


缺陷
是会在跳转目标页的时候,会有一个跳转到祖级页面,祖级页面又跳回父级页面的bug!!! 看上去就觉得在乱跳页面


场景
页面栈: 活动列表页 =&gt; 活动详情页 =&gt; 活动参加发布页
前...]]></description><category></category></item><item><title><![CDATA[[python][scrapy]没有上一页下一页只有页码的简单操作]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/104878396</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/104878396</guid><author>webfullstack</author><pubDate>Sun, 15 Mar 2020 14:34:55 +0800</pubDate><description><![CDATA[写在前面:
在简单的学习完爬虫入门后,自己做简单的采集时,发现目标网址下只有页码,没有上一页下一页,也一度放弃过,换了采集网址,后来又在书本上看到了解决方法,只是目前能用

下面时解决的代码截图

代码部分如下
def __init__(self):
        self.page_index = 1

# 提取下一页并提交给scrapy进行下载
        self.page_inde...]]></description><category></category></item><item><title><![CDATA[[wechat][css]文字两端对齐的替代方法]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/104862588</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/104862588</guid><author>webfullstack</author><pubDate>Sat, 14 Mar 2020 16:33:36 +0800</pubDate><description><![CDATA[写在前面,由于微信小程序不支持&nbsp;的语法,就是把decode='true’打开,会导致微信开发者工具报错卡死,所以才有了下面的css和伪类的配合使用

使用的方案
// 最好配合宽度使用
.c-label2{
   margin-right:unit(32,rpx);
    display: inline-block;
    width:unit(129,rpx);
    text...]]></description><category></category></item><item><title><![CDATA[[vue]报错:assigned to but it has no setter]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/103401901</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/103401901</guid><author>webfullstack</author><pubDate>Thu, 05 Dec 2019 11:43:17 +0800</pubDate><description><![CDATA[问题复现
v-model绑定的再用computed计算就会报错
解决方法
在computed中使用以下的设置
 _params1:{
   get(){
     let arr_ = [];
     let _params = this.params[this.filterProp[1]];
     let params_ = _params.split(',');
     if(para...]]></description><category></category></item><item><title><![CDATA[[wx-charts] 柱状图时间跨度大于25就显示不全]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/103390895</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/103390895</guid><author>webfullstack</author><pubDate>Wed, 04 Dec 2019 17:44:18 +0800</pubDate><description><![CDATA[问题复现

解决过程

尝试通过组件解决,在wx-charts的文档和社区转了好久也没有发现问题
经测试发现不是所有的时间段都显示不全,时间的天数跨度大于25天就显示不全
年份的跨度也不能大于25

经上面的过程,大致可以将逻辑设置为以下几步
a. 在picker设置拦截
b. 使用computed动态计算25的范围,包括天和年
codes:
天:
&lt;picker mode="date" f...]]></description><category></category></item><item><title><![CDATA[[webpack][ncu]ncu基础入门的使用]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/103251610</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/103251610</guid><author>webfullstack</author><pubDate>Tue, 26 Nov 2019 10:37:41 +0800</pubDate><description><![CDATA[ncu: npm-check-updates

官方网址: https://www.npmjs.com/package/npm-check-updates
// 安装
npm install -g npm-check-updates

// 检查更新
ncu

// 升级packjson.json
ncu -u

// 安装
npm isntall


...]]></description><category></category></item><item><title><![CDATA[[mini-wechat] [picker] 时间选择时范围限制]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/102955821</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/102955821</guid><author>webfullstack</author><pubDate>Thu, 07 Nov 2019 15:28:30 +0800</pubDate><description><![CDATA[范围限制:开始时间的结束 只能是 结束时间的开始, 结束时间的开始 是 开始时间的结束

代码相当简单

在开始的picker上添加end="{{params.endDate}}", 结束的picker上添加start="{{params.startDate}}",用参数自身做边界值  ????


举个栗子:
例如今天2019-11-7

点击了开始时间,只能选11-7当日或以前的11-7以后的都不...]]></description><category></category></item><item><title><![CDATA[[element-ui]el-table中设置类似标签的样式]]></title><link>https://blog.youkuaiyun.com/webfullstack/article/details/100561195</link><guid>https://blog.youkuaiyun.com/webfullstack/article/details/100561195</guid><author>webfullstack</author><pubDate>Thu, 05 Sep 2019 17:03:40 +0800</pubDate><description><![CDATA[效果图

思路与分析

可以直接使用定位做

给对应的单元格添加相应的class类


不能使用图片做,要使用背景和css3的伪类(画白色的三角)

注意事项

自身容器高度的限定及宽度的限定,
自身padding-bottom的设定,避免字过长时压住白色三角,
白色三角的高度不能过长,效果图上是0.05rem;且border宽是父级容器宽的一半,底部的border高度是border宽的一半
父级...]]></description><category></category></item></channel></rss>