杨威的博客

vue 组件的生命周期

在使用ant design tree构建一个树结构时，需要根据节点的不同类型使用不同的图标和标题颜色

先看效果： 再上代码 <template> <div class="pageRoot"> <van-nav-bar title="威哥头条" fixed /> <van-pull-refresh v-model="isLoading" @refresh="onRefresh"> <van-list v-model="loading" .

为了提高开发效率，我们经常会使用第三方组件库，例如Ant Design，Vant，Element等。一般组件库会为我们提供比较美观的样式供开发者选择，但是当提供的组件样式不满足需求时，我们需要能够自己来修改组件的样式。 例如下面这个例子，我用到了Vant组件库中的Navbar组件，这是一个标题组件，默认的样式是这样的： 现在我需要将组件的背景改为淡蓝色，文字改为白色。 首先利用谷歌浏览器的元素选择工具，查找到决定组件背景样式的clas...

路由：Hash地址与页面的对应关系。 1、vue-router的基本使用 （1）安装vue-roouter包 npm i vue-roouter@3.5.2 -S （2）创建路由模块 在src源代码目录下，新建roouter/index.js路由模块，并初始化如下代码： import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(VueRouter)) //调用Vue.use()函数，把VueRoouter安装为V

刚开始看Vue官方文档的时候对插槽不是很理解，其实通俗点来讲，插槽就是在自定义组件中预留一个位置，这个位置的内容可以由使用组件的人来定义，具有高度的灵活性。 1、使用场景 先来看看插槽的使用场景，否则可能连学习的欲望都没有了。插槽还是很重要的，即使不去定义，也要学会使用。 下面这个图中使用了Vant中的NavBar组件，该组件用于手机端标题展示，默认的组件展示的只有标题和返回按钮，但是在有些情况下，我们可能需要在标题栏中放一个增加或查询按钮，这个时候就需要利用插槽来让用户自己定义区域中的内...

每个.vue组件都由3部分构成，分别是： （1）template:组件的模板结构 （2）script:组件的javascript代码 （3）style:组件的样式 1、组件中的data不能是一个对象。必须是一个函数，通过return 返回一个数据对象： <script> export default{ data(){ return { userName:"张三丰" } } } </script>

在vscode中输入“@/"后如果可以智能提示路径，可以有效防止路径名称输入错误，减少不必要的麻烦。效果如下图所示： 安装"Path Autocomplete"插件后可以实现路径的智能提示，步骤如下： 1、在vscode中查找Path Autocomplete插件 2、安装插件 3、在vscode中选择“文件-首选项-设置”，在设置页面右上角点击图标打开settings.json配置文件 4、在配置文件中添加如下代码在 //导入文件时是否携带文件扩展..

1、侦听器用于监听变量值是否发生变化，从而针对数据的变化而做特定的操作。 基本语法： watch:{ userName(newVal,oldVal)//方法名必须跟监听的变量名称一致。 { //数据发生变化后执行的代码段，newVal和oldVal分别代表变化 前的值和变化后的值。 } } 2、默认情况下，组件在初次加载完毕后不会调用watch侦听器。如果想让watch侦听器在页面渲染完成