- 博客(21)
- 收藏
- 关注
RSS订阅原创 React + Vite项目别名配置
数组形式：Array<{ find: string | RegExp, replacement: string, customResolver?: ResolverFunction | ResolverObject }>由上图我们发现，我们虽然配置了别名，但是vscode并没有给出提示，那就意味着别名没有生效。对象形式：Record<string, string>因此我们需要手动创建。
2024-08-17 22:42:26
491
原创 2021面试题—vue篇
day1 - 双向数据绑定一、MVVMm model(模型) 指的是后端传输的数据v view(视图) 指的是所看到的页面vm viewmodel(视图模型) 它是MVVM的核心，是连接view和model的桥梁，它有两个方向：一是将【模型】转化成【视图】，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。二是将【视图】转化成【模型】，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听。这两个方向都实现的，我们称之为数据的双向绑定。总结：在MVVM的框
2021-05-31 00:48:09
629
原创 葵花宝典之TypeScript
文章目录一、基础类型声明：一、基础类型声明：undefined ：undefined 是所有类型的子类型let a:number;console.log(a); // undefined 明明是number类型，却打印出undefined，说明undefined是所有类型的子类型元组类型 Tunple：概念：表示一个已知元素数量和类型的数组，各元素类型不必相同。let arr: [string, number, object];arr = ["abc", 13, {a:
2020-11-04 22:13:59
228
原创 React生命周期函数
import React, { Component } from 'react'// 定义一个子组件class SubCom extends Component { state = { msg: '这是初始数据' } // 该生命周期函数可以监听页面数据的变化 UNSAFE_componentWillReceiveProps(nextProps, nextContext) { // 当父组件数据发生变化才会触发该生命周期函数的执行 console.log('
2020-11-02 21:50:35
151
原创 React中的事件绑定-DOM操作-setState函数的参数
EventBind.jsximport React, { Component } from 'react'import ReactDOM from 'react-dom';export default class EventBind extends Component { /** * * 该组件主要介绍： * 事件绑定 * 操作dom * setState() 的参数 */ constructor(props) { super(pr.
2020-11-02 21:49:29
632
原创 移动端适配方案
1. 使用百分比布局：<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no"> --> <script src="">
2020-11-02 21:48:51
102
原创 移动端基本事件
一、基础事件1、PC端事件a）onclick 鼠标点击触发b）onmousedown 鼠标按下触发c）onmousemove 鼠标移动触发d）onmouseup 鼠标抬起触发2、移动端触屏事件a) ontouchstart 手指按下触发b) ontouchmove 手指移动触发c) onTouchend 手指抬起触发<!DOCTYPE html><html lang="zh-CN"><head> <meta c
2020-08-23 08:14:57
198
原创 ElementUI框架中el-select组件在按回车时，如何隐藏下拉菜单，并触发键盘事件
场景：根据产品需求，下拉菜单在按下回车后进行搜索判断页面所需的筛选项是否为空，如果为空，按下回车，不执行查询按下回车，如何让下拉菜单隐藏（或者失去焦点，因为下拉项要显示的前提是获取焦点）源码：<el-col :md="8" :sm="12" :xs="24"> <el-form-item label="出差城市：" style="margin-bottom: -18px;"> <el-col :span="11"> <el-form-ite
2020-07-24 17:36:06
6606
2
原创 Vue中Event Bus的使用
使用场景：兄弟组件传参非父子组件传参注：父子组件传参也是可以的，但是因为父子组件传参比较简单，如果使用eventBus或者Vuex显得大材小用了效果展示：代码展示：在utils中创建一个eventBus.js文件，用来导入导入vue实例对象import Vue from 'vue';export default new Vue();既然叫事件车，那肯定就有个上车和下车的过程，我们在A组件上车<template> <div class="wrap"&g
2020-07-03 14:07:30
250
原创 Vue中的动态组件切换——类似选项卡
场景：在实际项目开发中，我们经常会遇到选项卡切换，对于一个前端工程师来说，组件化/模块化开发是一种必备的行为规范，我们经常会把每个选项卡的主体作为一个单独的组件，然后通过v-if/v-show来判断显示当前选项卡，这样的话我们就要将所有的组件都要注册并使用，代码会有点冗余，今天分享一个可以简化代码的骚操作。代码：<template> <div class="about"> <button @click="checkComponent">点击随机切换A
2020-07-02 15:02:46
765
原创 JS中将日期对象转换成日期格式字符串
1. 将日期对象转成指定格式的日期字符串：2. 将日期对象转换成指定格式的时间字符串：3. 将日期对象转成指定格式的日期时间字符串：
2020-06-20 15:22:04
1282
原创 ElementUI UI框架中竖式步骤条step组件如何在右侧显示日期
1.场景：实际开发中，我们经常会遇到步骤条可能会是竖直的，例如审批、快递配送等案例。今天给大家分享一个比较常用的案例，配后后端返回的数据实体举例：图一为ElementUI框架中提供的原始step组件，图二为我们今天要实现的效果：图一：图二：2.实现：<template> <div> <!-- 查看审批进度 start --> <div style="overflow-y: auto"> <el-steps d
2020-06-11 20:56:13
3617
2
原创 flutter中数据持久化插件shared_preferences案例介绍
场景介绍：在电商类App开发中，通常都会有一个功能模块——购物车，购物车中的一项功能是持久化，就是我们关掉APP，下次进入后，还是可以显示出我们放入购物车的商品（类似于缓存localStorage、sessionStorage）。但是这些商品不和后台进行数据交互，前台如果使用sqflite又显得太重，还要懂SQL知识。所以在购物车页面我们采用shared_preferences来进行持久化，它是简单的键-值的操作，可以实现常见增删改查功能。功能实现：安装插件GitHub地址：https://g
2020-05-28 13:24:01
639
原创 uni-app中设置沉浸状态栏
场景：在App开发中，我们会经常遇到以下这种情况：原生导航栏不占位置，也就是说内容是从屏幕可视区开始渲染的原生导航栏的颜色可以自定义解决方案：全局取消原生导航栏，注释或者删除即可。在每个页面单独配置style，当navigationStyle设为custom或titleNView设为false时，原生导航栏不显示：{ "path": "pages/detail/detail", "style": { // "navigationStyle":"custom", "navi
2020-05-26 16:58:04
4560
4
原创 Flutter中的企业级路由配置
在实际开发中，flutter自带路由让我们用起来很不爽，操作起来不是很便捷，因此给大家推荐一款企业级路由组件 fluro下载地址附一张路由目录结构图吧在 pubspec.yaml 文件中安装最新版本的插件fluro: "^1.6.3"在lib目录下新建一个routers目录，用于存放handler文件创建router_handler.dart文件——开发路由import 'package:flutter/material.dart';import 'package:fluro/fl
2020-05-25 14:38:10
545
原创 Element UI框架中Table组件固定列时表格表头与内容边框错位问题
今天使用ElementUI的表格（固定列），发现表格的表头与内容会发生错位，效果图如下所示：解决方案：在根组件中添加如下样式：body .el-table th.gutter{ display: table-cell!important;}是不是完美解决拉，小伙伴们~~~...
2020-05-20 16:27:05
1751
2
原创 Provide状态管理方案
说明：状态管理说白了就是在一个地方设置了数据，其他地方的数据就会跟着改变，常见的应用有，登录、购物车等。废话不多说，直接上代码。需求：在购物车界面做一个计数器，点击按钮后+1，然后在其他页面显示对应的值，效果图如下：实现：安装插件：pubspec.yaml（版本可从github获取最新的）provide: ^1.0.2创建文件lib/provide/counter.dartimport 'package:flutter/material.dart';// 混入 class
2020-05-15 11:25:26
266
原创 Vue中路由监听无法生效
需求：点击编辑按钮，跳转到编辑页面，编辑好信息后，点击保存，返回到列表页面，并且显示原来高亮的选项卡，而且列表页数据更新。问题：在编辑页面是通过路由接受传来的id，当前选中的选项卡activeName，然后通过id查询数据，回显到表单中，但是通过路由传过来的参数，在刷新页面时，路由传传过来的参数会丢失掉；在编辑页面点击保存后，跳转到列表页时，要实现页面刷新，并且选项卡高亮应在上一次编辑对应的位置，我采用的方案是路由监听，但是当路由发生变化后，就刷新页面，也就是重新请求数据，但是我见听了路由
2020-05-14 15:17:57
3359
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人