weixin_46138124的博客

在父组件操作<template> <div id="nav"> <h3>{{title}}</h3> <button @click="setTitle">同时改变title</button> </div></template><script> import { ref, provide } from 'vue' export default { setup() {

在src下新建文件装载公用方法：mixin/baseMixin.jsconst baseMixin = { data() { return { title: '这个是公用标题' } }, methods: { onClick() { console.log('我被点击了') } }}export default baseMixin;然后可以在需要调用的组件中调用：src/view/App.vue<template> <div clas

vue3版本vuex实现获取与写入方法1、store文件夹的index.js文件下操作vuex分模块管理导入：2、store/appStore.js文件创建存取需求的操作方法3、views/app.js文件下渲染、存取操作1、store文件夹的index.js文件下操作vuex分模块管理导入：import { createStore } from 'vuex'import appStore from './appStore'export default createStore({ module

让我们返璞归真，从原始的前端开发讲起。上图是一个“可爱”的index.html页面和它的样式文件a.css，用文本编辑器写代码，无需编译，本地预览，确认OK，丢到服务器，等待用户访问。前端就是这么简单，好好玩啊，门槛好低啊，分分钟学会有木有！然后我们访问页面，看到效果，再查看一下网络请求，200！不错，太™完美了！那么，研发完成。。。。了么？等等，这还没完呢！对于大公司来说，那些变态的访问量和性能指标，将会让前端一点也不“好玩”。看看那个a.css的请求吧，如果每次用户访问页面都要加载，是不是很影.

react 组件传参问题父组件对子组件传输数据使用表单的时候遇到的一个问题，子组件二次编辑表单的数据id是上次传输数据的id，不是最新传入数据id，以下是我解决的方法：父组件对子组件传输数据使用表单的时候遇到的一个问题，子组件二次编辑表单的数据id是上次传输数据的id，不是最新传入数据id，以下是我解决的方法：import React, { useRef } from "react";const RolesManagerForm: React.FC<Components> = (props

useCallback：接收一个内联回调函数和一个依赖数组，返回一个记忆版本的回调函数。如果第二个参数没有指定改变值的情况，它只会在第一次时进行该值闭包缓存，不再更新import React, { useState, useCallback } from 'react';const [getImageUrl, setImageUrl] = useState<string>("")...

使用变量动态获取属性import React from "react";import 'antd/dist/antd.css';import { ManOutlined, WomanOutlined } from '@ant-design/icons';import Img from '@/assets/login-bg.png';// props获取的data数据规则export...

webpack npm指定版本安装对于一些项目，webpack的最新版本可能对不上项目已置版本的条件，运行会报错，需要安装对应的版本即可：对于一些项目，webpack的最新版本可能对不上项目已置版本的条件，运行会报错，需要安装对应的版本即可：1、删除全局webpack-clinpm uninstall -g webpack-cli删除本地（局部）webpack-clinpm uni...

Error: Cannot find module '@babel报错问题问题产生的原因：babel-loader和babel-core版本不对应所产生的1.babel-loader 8.x对应babel-core 7.x2.babel-loader 7.x对应babel-core 6.x解决方法：1、 卸载旧的babel-corenpm un babel-core2、 安装新的...

升级cnpm install --save react@16.13.1 react-dom@16.13.1

使用 typescription 遇到的类型问题Promise定义问题Promise定义问题// Promise需要用函数来定义const onLoadData: (val: TreeNodeInterFace)=>Promise<void> = ({key, children}) => { return new Promise(resolve =&g...

vue ant design 封装弹窗表单用法<template> <div id="formForm"> <a-modal :visible="visibleOff" :title='title' @ok="handleOk('ok')" ...

vue You cannot set a form field before rendering a field associated with the value. 问题解决方式一、方式二、方式三、方式四、问题起因：使用了表单的方法setFieldsValue()，来设置一组输入控件的值，传入的值为object，但是传入的值要和表单的值一一对应，能少传不能多传。遇到这种情况的解决方式为：for...

一个中文作为两个字符，一个数字或者字母作为一个字符来算var str = "01abc23中文4567中ad文89中文";str=str.replace(/[^\x00-\xff]/g,"$&\x01").replace(/.{10}\x01?/g,"$&
").replace(/\x01/g,"");alert(str);...

Vue中的倒计时<template> <el-button type="text" v-text="keepTime" @click="StartCountDown"></el-button></template>export default { data() { return { keep...

npm 安装教程（cnpm）一、下载nodejs二、安装三、日常测试四、安装淘宝镜像npm（cnpm）一、下载nodejs [下载比较快的传送门](http://nodejs.cn/download/)二、安装 安装一般来说都是“NEXT”。三、日常测试四、安装淘宝镜像npm（cnpm）npm install -g cnpm --registry=https://registr...

vue要升级，一般就是升级 vue 和 vue-template-compiler，两者的版本需要同步第一步第二步完成第一步npm update vue-template-compiler -D 或者 yarn add vue-template-compiler -D第二步npm update vue -S 或者 yarn add vue -S完成...

css没有常记的配合属性一、强制换行二、不换行三、神奇的滚动效果动画效果官网去掉元素溢出滚轮滚轮增加颜色鼠标小手效果将video视频标签占满属性忽略顶层元素取消忽略顶层元素图片变色一、强制换行word-break: break-all;word-wrap: break-word;white-space: pre-wrap;二、不换行white-space:nowrap;text-o...

新版webpack配置babel时候报错 in ./src/main.ts Module build failed（from ./node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js）这种错就是最新的babel已经不是这样配置的了。最新配置步骤第一步第二步第三步第四步第五步第六步第七步package.json文件配置结果在.babel...

vue cli es6转es5 保证浏览器兼容性安装在根目录下创建.babelrc文件IE报vuex requires a Promise polyfill in this browser问题解决开发过程中，由于需要使用了async await，只有少数的浏览器支持，极大多数的浏览器是不支持这玩意的，最后总结了两个方案安装npm install --save-dev babel-preset...