- 博客(66)
- 收藏
- 关注
原创 获取URL地址参数的实用方法
在 URL 中,查询参数字符串值通常提供有关请求的信息,例如搜索参数或正在使用的对象的 ID。要将查询参数解析为对象,请使用 URL.searchParams 的 .entries()方法,该方法返回一个 Iteratorkey/value 对,并将Object.fromEntries其转换为对象。它通过解析 URL 的查询字符串并提供访问值的方法来工作。它提供了一种更灵活的 URL 解析方式,还提供了一种访问查询字符串值的方式。上面的 url 对象也将 URL 的所有部分分解成各个部分。
2024-07-02 09:04:22
881
原创 Nuxt快速学习开发 - Nuxt3静态资源Assets
Nuxt 使用两个目录来处理样式表、字体或图像等资产。public/目录内容按原样在服务器根目录中提供。assets/目录包含您希望构建工具(Vite 或 webpack)处理的所有资产。public/目录public目录用作静态资产的公共服务器,可在您的应用程序定义的URL上公开访问。public/您可以从您的应用程序代码或通过根 URL 从浏览器中获取目录中的文件/。Nuxt 使用Vite或webpack来构建和捆绑您的应用程序。
2024-06-17 10:41:43
647
原创 Nuxt快速学习开发---Nuxt3视图Views
除非需要,否则最好坚持使用默认值,nuxt会自动根据设置的命名生成目录结构dir: {//自定义Nuxt使用的目录结构,除非需要,否则最好坚持使用默认值。assets: "assets", //静态资源目录 默认: "assets"layouts: "layouts", //布局目录,其中的每个文件都会自动注册为 Nuxt 布局。默认: "layouts"middleware: "middleware", //中间件目录,其中的每个文件都会自动注册为Nuxt中间件。
2024-06-17 10:36:32
568
原创 Nuxt快速学习开发 -- Nuxt3配置
定义要全局设置的 CSS 文件/模块/库(包含在每个页面中,全局生效,确保css资源路径存在或文件中存在样式否则会警告或报错。Nuxt DevTools 当前作为模块提供(将来可能会更改)。如果您愿意,您也可以在本地安装它,这将为您的所有团队成员激活。该方式针对服务端渲染的场景也能生效,但是仅会针对发生在客户端测的请求进行代理。文件位于 Nuxt 项目的根目录下,可以覆盖或扩展应用程序的行为。上面配置项为大部分nuxt默认配置项,下面内容将介绍单个配置。或者因为一些交互行为而触发的网络请求。
2024-06-17 09:57:49
1810
原创 JS URL()和URLSearchParams() API接口详细介绍
web这块,无论是CSS,HTML还是JS API都在不断进步,标准且跨平台,以前很多需要自定义的方法和特性,现在浏览器都已经原生支持,以前的那些语言框架价值越来越低。是时候开始尝试拥抱原生,辛苦地学习与积累,简单且轻松的实现,面向产品,面向用户,立足未来,方能穿越长河。
2024-06-12 10:43:02
773
原创 nvm安装使用 切换node版本失败的办法 (保障文章,解决你一切问题)
另外特别注意: nvm的激活工作区目录(你安装时手动指定的空目录),实际是一个指向nvm安装目录中已安装nodejs的快捷方式/软连接:NVM_SYMLINK。nvm是一款强大的node多版本管理器,可以轻易选择你需要的node版本,这对win7平台简直就是超好的福音:可以突破node 14.15以上的安装限制。为了解决nvm下载node速度过慢的问题,nvm安装目录下的settings.txt修改文件,增加node的淘宝镜像地址: (而是要指定一个你事先创建的空目录,作为nvm的激活Node工作区。
2024-05-30 10:30:11
1030
1
原创 vscode 的 AI 协助插件 Tabnine / Codeium
它可以根据您输入的代码段和上下文信息,预测并推荐可能的代码补全选项,从而提高编写代码的效率。如果有需要,可以用它辅助编写单元测试。l 人工智能聊天:Codeium拥有人工智能聊天的功能,可以回答程序员的问题和提供技术支持,帮助他们更好地应对编程和计算机科学方面的挑战。l 代码智能提示:Codeium能够实时智能提示代码,代码提示完全基于人工智能自动完成,生成速度快,延时较低,帮助程序员更快地编写代码。3、在维护老项目时,对于较长的方法,可以借助Codeium生成适当的注释说明,更加快速的接手和开发。
2024-05-23 15:49:41
1458
原创 Vue 路由跳转设置不刷新
注意: 只有组件被 keep-alive 包裹时,这两个生命周期函数才会被调用,如果作为正常组件使用,是不会被调用的,以及在 2.1.0 版本之后,使用 exclude 排除之后,就算被包裹在 keep-alive 中,这两个钩子函数依然不会被调用!另外,在服务端渲染时,此钩子函数也不会被调用。所以使用keep-alive就是保持组件活跃,不会被destroy销毁掉,就一直还活着,组件没有被销毁掉的话,组件上挂载的数据就还存在,所以状态就可以保留,所以,keep-alive就可以保持组件的状态。
2023-10-09 09:21:39
3019
原创 vue2 和 vue3 的插件使用 (vetur / volar)
vue2 使用 vetur 插件vue3 建议禁用 vetur 使用 volar
2022-10-27 15:45:59
4160
原创 vue3.2 main.js的配置 , vuex的配置,setup的使用。
【代码】vue3.2 main.js的配置 , vuex的配置,setup的使用。
2022-09-26 16:54:04
529
原创 vue3 vue-i18n警告 解决方案
*You are running the esm-bundler build of vue-i18n. It is recommended to configure your bundler to explicitly replace feature flag globals with boolean literals to get proper tree-shaking in the final bundle.**
2022-09-15 17:31:29
2314
原创 vue 楼梯导航 ,滚动定位,锚点导航
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>vue锚点平滑滚动</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="demo-app" v
2022-04-20 16:10:09
1207
原创 vue 3.0 新增的功能
一:性能提升:(1.3~2X) Compiler 原理:https://vue-next-template-explorer.netlify.app/二: TS支持,新增:Fragment,Teleport,SuspenseFragment:不受根节点限制,渲染函数可接收ArrayTeleport:类似Portal,随用随取,e.g.弹框,ActionsSuspense 嵌套的异步依赖,e.g.async setup()三: 按需加载 (配合Vite)&组合API (Composit
2022-02-17 16:39:42
615
2
原创 jq 滚动加载
复制下来直接用<style>* ul { list-style:none; padding:0; margin:0;}.m { margin-left:auto; margin-right:auto; width:150px}li { width:150px; height:auto; border:1px dashed blue; margin-bottom:10px;}</style><div class="m"> &
2022-01-15 17:09:44
365
原创 VUE 实现纯前端导出Excel
第一:安装依赖: // npm cnpm install --save file-saver xlsx cnpm install --save script-loader第二:在本地项目里放入excel.js和Export2Excel.js 文件(放在src目录下面) // 使用 在项目文件中引入 import { exportExcels } from '@/excel/excel.js'// 使用的方式 let list=[ { bianhao:'1
2022-01-11 18:33:23
1258
原创 React的生命周期函数的过程
// 这个是挂载的阶段 //第一次进去的时候执行 页面挂载之前执行的 (组件在“即将挂载”到页面上的的时候自动执行) componentWillUnmount() { console.log("componentWillUnmount"); } render() { console.log('render'); return ( // jsx的语法块 //Fragment是jsx是占位符 <Fragment&g...
2021-12-07 16:02:16
490
原创 React 的ref 的使用 ,以及setState与ref的结合使用
setState 是异步操作,在setState前后使用ref 始终都是慢一步,想要早setState同步后使用ref。请看下面: <button onClick={ this.clickSubmit}>提交</button> <ul ref={(ul) => { this.ul = ul }}> { this.state.list.map((item, index) => { // danger
2021-12-06 15:49:58
1002
原创 React 的强类型校验(propTypes),必传(isRequired),默认值(defaultProps) 的使用
propTypes 的使用propTypes:接受外部传过来的参数 并对其做强类型检验import React, { Component } from "react";import PropTypes from 'prop-types'//TodoItem 代表一个子组件// TodoItem.propTypes 对父组件的属性做强类型校验TodoItem.propTypes = { test:PropTypes.string.isRequired, // isRequired 是必传 的
2021-12-03 15:33:44
1865
原创 React html标签转义, ’dangerouslySetInnerHTML‘的用法
在react中,想要标签不被显示出来,使用“dangerouslySetInnerHTML”转义一下;dangerouslySetInnerHTML 的用法: //list:['1','2'] <ul> { this.state.list.map((item, index) => { // dangerouslySetInnerHTML 不会展示标签 return (
2021-11-29 15:49:49
1134
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人