vue3组件的数据双向绑定

第一步 在组件中向props添加`modelValue`属性 export default defineComponent({ props: { modelValue: String }, 在组件更新值的时候，发送一个`update:modelValue`的事件 {{inputRef.message}}...

Suspense异步请求组件

通过Suspense我们可以方便的实现异步请求，加载前和加载后的效果 通常我们都要一个需求，当组件中的数据还在请求时，展示`loading`效果，当请求完毕时在展示正常的数据 之前这部分逻辑要我们自己定义，现在可以使用`...

Teleport

Teleport 为什么要使用 Teleport? 老规矩，先来看一个需求 实现一个全局的`modal`组件，在所有组件通用 Modal.vue 确定要删除吗？ import { defineComponent } from 'vue'; export defau...

Vue3模块化妙用初体验

如下需求 当鼠标点击的时候，记录当前点击的坐标（x,y）用vue3实现 X:{{x}} Y:{{y}} import {ref,onMounted,onUnmounted} from 'vue'; export default { setup(){ const x = ref(0) const y...

泛型

引入 在引入泛型前先来看一个需求 定义一个函数，这个函数的返回值就是传入的参数 function echo (arg){ return arg } const result = echo(123) //any 由于我们这里没有定义`arg`和函数返回值的类型因此`r...

Node.js抓取网站，GBK，GB2312中文乱码解决办法

问题引入 async function getHtml(){ let res = await axios.get(publicPath+"/pic/") console.log(res) } 如上代码，axios默认是以utf8的方式去解码html 由于原网页的编码方式是`gb2312` 控制台打印中...

从零开始搭建Vue工程

项目骨架 object --dist --src ----assets ------images ------styles ----index.js ----app.vue --webpack.config.js dist目录存放编译后的资源 src存放源码文件 运行命令 `np...

Automatic publicPath is not supported in this browser

webpack打包资源出现 `Automatic publicPath is not supported in this browser ` 解决方法： 在webpack.config.js文件中添加 ` module.exports = { output: { publicPath: './' } } `

configuration.devtool should match pattern "^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)

之前 config.devtool = ' cheap-module-eval-source-map' 现在改成 config.devtool = isDev ? false : ' cheap-module-eval-source-map'

Cannot find module 'webpack-cli/bin/config-yargs'

webpack编译遇到问题 Cannot find module 'webpack-cli/bin/config-yargs' 原因 webpack-cli与webpack-dev-server版本不兼容 解决办法 1.降级webpack-cli 卸载当前的 webpack-cli npm uninstall webpack-cli...