- 博客(14)
- 收藏
- 关注
RSS订阅原创 axios配置,vue路由的配置,router
axios配置封装请求地址的基础路径，src/utils/request.js//引入 import axios from "axios";axios.defaults.baseURL = "http://157.122.54.189:6002" // 服务器地址//导出export default axios 封装请求函数，src/api/user.js// 封装用户相关的接口import axios from "../utils/request"// 登录接口 po.
2022-03-05 14:53:22
1042
原创 vue的基础指令
v-bind:属性名="vue变量" 简写:属性名="vue变量"v-on:事件名="methods中的函数 简写: @事件名="methods中的函数"传参, 通过$event指代事件对象传给事件处理函数 示例 @click="two(10, $event)"v-on修饰符 @事件名.修饰符="methods里函数".stop - 阻止事件冒泡.prevent - 阻止默认行为.once - 程序运行期间, 只触发一次事件处理函数v-on按键修饰符...
2022-03-02 20:49:07
318
原创 @vue/cli脚手架
@vue/cli的好处 开箱即用 0配置webpack babel支持 css, less支持 开发服务器支持 @vue/cli安装目标: 把@vue/cli模块包按到全局, 电脑拥有vue命令, 才能创建脚手架工程yarn global add @vue/cli# ORnpm install -g @vue/cli@vue/cli 创建项目启动服务目标: 使用vue命令, 创建脚手架项目# vue和create是命令, vuecli-demo..
2022-03-02 20:03:09
351
原创 webpack(模块打包工具)的配置
webpack使用步骤环境准备 1.初始化包环境（得到package.json文件）npm init -y2.安装依赖包npm install webpack webpack-cli -D3.配置scripts (自定义命令)"scripts ":{ "build":"webpack"}webpack-入口和出口配置文档: https://webpack.docschina.org/concepts/#entry1.新建webpack.config.js
2022-02-28 21:58:20
396
原创 input光标问题，自定义光标位置
setSelectionRange()MDN官方文档：HTMLInputElement.setSelectionRange() - Web API 接口参考 | MDN示例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta
2022-02-27 10:54:35
390
原创 React 使用 `formik` 库进行通用表单的数据绑定 及校验表单
使用 formik 库进行通用表单的数据绑定安装 formik npm iformik官方文档：useFormik() | Formikhttps://formik.org/docs/api/useFormik/* 学习目标：使用formik收集表单数据*/import Input from '@/components/Input'import NavBar from '@/components/NavBar'import styles from './index.modu...
2022-02-24 10:30:27
805
原创 react ts版 组件封装总结
/* 学习目标：组件封装总结 步骤： 1. 一般组件要支持style与className，👍方便组件自定义样式 2. 考虑联合字面量+字符串，提供代码提示 3. 复用React或第三方的类型，快速获得代码提示 4. 🔔自己写代码的技巧：TSX中封装组件，一般需要先定义props类型，后使用。类似vue中的props 组件封装要考虑的（三种）四种状态*/...
2022-02-23 17:10:14
925
原创 创建redux仓库 ts版
在scr下创建store： 1. 新建store/action/user.ts 2. 新建store/reducer/user.ts 3. 新建store/reducer/index.ts ：合并reducer 4. store/index.ts 创建store：连接调试工具 5. Provider连接React和Reduxsrc/store/reducer/user.tsconst initialState = {...
2022-02-23 14:51:18
278
原创 react 路由设置懒加载 ts版
1. 组件导入方式，改为React.lazy(() => import ('xxx'))2. React.Suspense组件负责懒加载，🔔包住Switch组件🔔设置fallback属性import { BrowserRouter as Router, Redirect, Route, Switch } from 'react-router-dom'// import Login from '@/pages/Login'// import Layout from '@/pages
2022-02-23 12:24:44
847
原创 React 路由基本使用
代码示例(有Logint和Layout组件)import React from 'react'import { BrowserRouter as Router, Redirect, Route, Switch } from 'react-router-dom'import Login from '@/pages/Login'import Layout from '@/pages/Layout'export default function App() { return ( &...
2022-02-23 11:44:52
706
原创 React 移动端`1px`像素边框
1.准备hairline.scss文件2.给需要的类名，添加样式其他资料参考 antd-mobile 的实现实现原理hairline.scss 文件具体的代码如下// 参考： https://github.com/ant-design/ant-design-mobile/blob/v2/components/style/mixins/hairline.less// 原理： 伪元素 + transform 缩放// 伪元素::after或::before是独立于当..
2022-02-23 10:55:46
185
原创 React 配置路径别名(绝对路径) @ 和 配置视口单位插件(屏幕适配)
配置文档地址https://github.com/gsoft-inc/craco/blob/master/packages/craco/README.md#configurationhttps://github.com/gsoft-inc/craco/blob/master/packages/craco/README.md#configuration下面为提取的操作步骤1.安装修改 CRA 配置的包：npm i-D @craco/craco2.在项目根目录中创建 craco 的配置文件：c.
2022-02-23 10:24:02
1135
原创 点击单选项显示不同内容(Vue)
<template> <div class="messageItem" style="height:540px;overflow-y:auto;"> <div class="oneMsg" style="font-size:18px"> <span class="case" >水果分类</span> <el-radio-group v-model="index...
2022-02-22 14:59:30
456
原创 JavaScript(数组常用方法)
数组数组常用方法数组常用方法方法名 含义 reverse() 将数组元素倒序排列 indexOf() 查询指定元素第一出现的位置 lastIndexOf() 查询指定元素最后一次的位置 join() 拼接为字符串 concat() 将多个组拼接成一个数组 push() 向数组末尾添加新的元素 pop() 删除并返回数组的最后一个元素 unshift() 向数组开头添加新的元素，返回新的数组长度 shift
2022-02-22 14:51:12
258
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人