zl程序教程

Vue笔记(8)

  • vue slot插槽_笔记本内存条插槽显示4个

    vue slot插槽_笔记本内存条插槽显示4个

    大家好,又见面了,我是你们的朋友全栈君。为什么使用slotslot(插槽)在生活中很多地方都有插槽,电脑usb的插槽,插板当中的电源插槽插槽的目的是为了让我们原来的设备具备更多的扩展性比如电脑的USB我们可以插入U盘,手机,鼠标,键盘等等 组件中的插槽组件的插槽也是为了让我们的组件更具有扩展性让使用者决定组件内部的一些内容到底展示什么 例子移动开发中,几乎每个页面都有导航栏导航栏我们必然封装成

    日期 2023-06-12 10:48:40     
  • Vue笔记(2)

    Vue笔记(2)

    学习内容⊙动态绑定style样式 ⊙ 计算属性 ⊙ 事件监听 v-on⊙ v-on修饰符⊙ 条件判断不仅仅是可以动态绑定class,style样式也是可以动态绑定的动态绑定style 1.对象形式::style="{key(属性名), value(属性值)}" 试了一下,如果是像font-size这种中间有-连接的属性,需要使用驼峰法来

    日期 2023-06-12 10:48:40     
  • Vue笔记(7) 很长

    Vue笔记(7) 很长

    学习内容 ⊙ 作用域插槽 ⊙ ES6模块的导入和导出 ⊙ 认识webpack ⊙ 安装webpack ⊙ 使用webpack ⊙ loader ⊙ ES6转ES5作用域插槽 一句话来说就是: 父组件替换插槽的标签,但是内容由子组件来提供 现在做这个案例: 搭建好基本的结构 那么此时我想在vue实例组件中使用子组件中的PLanguage的data,显然是不能直

    日期 2023-06-12 10:48:40     
  • Vue笔记(8)

    Vue笔记(8)

    学习内容⊙ 配置Vue⊙ el和template的区别⊙ 认识plugin⊙ 搭建本地服务器⊙ 配置文件的分离 啊,今天运行昨天的程序结果疯狂报错,气死我了 配置Vue 后续项目中,我们会使用Vuejs进行开发,而且会以特殊的文件来组织Vue的组件 所以,下面我们来学习一下如何在我们的webpack环境中集成VueJS 现在我们希望在项目中使用Vue,那么必然需要对其有依赖,所以

    日期 2023-06-12 10:48:40     
  • Vue学习笔记之使用正则表达式提示Single character alternation in regex

    Vue学习笔记之使用正则表达式提示Single character alternation in regex

    0x00 概述在WebStrom中使用正则表达式,工具提示Single character alternation in regex0x01 问题Vue页面需要处理多选产生的列表,["a", "b", "c", "d"]复制转换成如下格式的字符串,入库a,b,c,d复制需要去掉 [ ,  ]  ,  " 

    日期 2023-06-12 10:48:40     
  • Vue学习笔记之Vue判断字符串(或数组)中是否包含某个元素

    Vue学习笔记之Vue判断字符串(或数组)中是否包含某个元素

    0x00 概述Vue判断字符串中是否包含某个字符串, 有如下方法。0x01 includes方法(数组,字符串都可以)var str = “Hello World!”; if(str.includes(“World”)){ }复制 数组兼用,举例如下:let animals = [“cat”, “dog”, “pig”, “deer”] animals.includes(“deer”) // tr

    日期 2023-06-12 10:48:40     
  • Vue3学习笔记(四)——组件、生命周期

    Vue3学习笔记(四)——组件、生命周期

    一、组件如果我们将一个页面中所有的处理逻辑全部放在一起,处理起来就会变得非常复杂,而且不利于后续的管理以及扩展,但如果,我们将一个页面拆分成一个个小的功能块,每个功能块完成属于自己这部分独立的功能,那么之后整个页面的管理和维护就变得非常容易了。如果我们将一个个功能块拆分后,就可以像搭建积木一下来搭建我们的项目。1.0、SPASPA指的是Single Page Application,就是只有一张W

    日期 2023-06-12 10:48:40     
  • Vue.js 学习笔记 - 组件(Components)

    Vue.js 学习笔记 - 组件(Components)

    Vue 组件注册Components 要确保在初始化根实例 之前 注册了组件全局注册:Vue.component('my-component', { template: '<div>A custom component!</div>' }) // 创建根实例 new Vue({ el: '#example'

    日期 2023-06-12 10:48:40     
  • Vue-travel学习笔记

    Vue-travel学习笔记

    vue去哪网跟学笔记记录学习点滴1. 初始化项目1.1 手机显示配适minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" 阻止用户手滑发大缩小页面1.2 初始化样式 –>引入reset.css1.3 移动端多倍屏边框不准的问题 –> 引入 border.css1.4 解决click延迟300ms的问题 –> 引入 f

    日期 2023-06-12 10:48:40     
  • Vue学习笔记之opensslErrorStack: [ ‘error:03000086:digital envelope routines::initialization error‘ ]的问题

    Vue学习笔记之opensslErrorStack: [ ‘error:03000086:digital envelope routines::initialization error‘ ]的问题

    0x00 概述前端Vue项目启动报错如下:/** <s> [webpack.Progress] 10% building 0/1 entries 0/0 dependencies 0/0 modules node:internal/crypto/hash:67 this[kHandle] = new _Hash(algorithm, xofLen); ^ Error: error:

    日期 2023-06-12 10:48:40     
  • Vue学习笔记(三)

    Vue学习笔记(三)

    Vue 学习笔记(三)1. 插槽插槽允许开发者在封装组件时,把不确定的、希望由用户指定的部分定义为插槽。我们使用标签时,开始标签和结束标签之间之前都没有写东西。组件的标签和正常的双标签,如 div、p 等一样,可以在里面写东西。但是,直接在里面写,会发现,写的东西不会显示出来,也找不到了,被丢弃了。其实这个也挺好理解的,组件本来就有东西了,vue 又不知道你写的东西要插到哪里去。所以,vue 提供

    日期 2023-06-12 10:48:40     
  • Vue3.0踩坑笔记

    Vue3.0踩坑笔记

    监听路由变化踩坑:由于route.path是异步获取当前path,导致页面刷新并不能保持menus正确的active。 解决方案:使用watch监听当前path,可拿到最新的path1 const selectedKeys = ref([]); 2 3 // 监听路由变化,更新menus当前选中 4 watch( 5 () => route.path, 6

    日期 2023-06-12 10:48:40     
  • Vue开发、学习笔记,持续记录

    Vue开发、学习笔记,持续记录

    Vue每天学一些,慢慢的也学下来了。记一些笔记生命周期图:https://nicen.cn/collect/life.pngVue-Router学习:https://nicen.cn/vue-router.html开始Vue官网: https://vuex.vuejs.org/zh/基于Vue的各种UI库 Vuetify :https://vuetifyjs.com/zh-HansElement-

    日期 2023-06-12 10:48:40     
  • Vue Ant Admin学习笔记,持续记录

    Vue Ant Admin学习笔记,持续记录

    Vue Ant Admin基于Vue2.x的中后台管理系统:https://iczer.gitee.io/vue-antd-admin-docs/比较漂亮的,可以借鉴的:https://vue-admin-beautiful.com/admin-proAnt Design of  Vue: https://antdv.com/docs/vue/introduce-cn/(V2及以上版本为Vue3.

    日期 2023-06-12 10:48:40     
  • SortableJS / vue.draggable.next 使用笔记,持续记录

    SortableJS / vue.draggable.next 使用笔记,持续记录

    起步东西确实是好东西,奈何一开始文档没捋清,费了一番时间好好琢磨了一下。Github:https://github.com/SortableJS/vue.draggable.next,完整代码如下:<draggable v-model="myArray" group="people" @start="drag=true

    日期 2023-06-12 10:48:40     
  • vue笔记:vue组件的生命周期

    vue笔记:vue组件的生命周期

        vue组件的生命周期 Vue实例有一个完整的生命周期,从开始创建、初始化数据、编译模板、挂在DOM、渲染-更新-渲染、卸载等一系列过程,我们成为Vue 实例的生命周期,钩子就是在某个阶段给你一个做某些处理的机会。     beforeCreate( 创建前 ) 在实例初始化之后,数据观测和事件配置之前被调用,此时组件的选项对象还未创建,el 和

    日期 2023-06-12 10:48:40     
  • Vue笔记:封装Echarts

    Vue笔记:封装Echarts

      Echart.vue组件的封装 data中是固定属性,props中定义动态参数,是父组件获取数据时传递到子组件的参数,xData为横坐标轴数据,series为Echarts的series数据,isAxisChart为是否带有坐标轴。 <template> <div style="height: 100%" ref="echart"> echar

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue制作个人简历并使用Nginx部署

    Vue笔记:Vue制作个人简历并使用Nginx部署

      一、实现效果 项目使用Vue3+ElementUI+BootStarp Github地址:https://github.com/Angell1/CV 测试页面:http://123.207.251.121:8888/ 环境:     部署 1、Vue打包 npm run build 注意:我使用vue3,所以自定义配置文件: module.export

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue小练习

    Vue笔记:Vue小练习

        div切换 <template> <div id="app"> <div class="tab-tit"> <!--点击设置curId的值 如果curId等于0,第一个a添加cur类名,如果curId等于1,第二个a添加cur类名,以此类推。添加了cur类名,a就会改变样式 @clic

    日期 2023-06-12 10:48:40     
  • Vue笔记:vue-router

    Vue笔记:vue-router

      目录 路由介绍 路由的基本配置 路由跳转 动态路由 嵌套路由 vue-router中的$route和$router 路由介绍 SPA(single page application):单一页面应用程序,只有一个完整的页面;它在加载页面时,不会加载整个页面,而是只更新某个指定的组件。 单页面应用(SPA)的核心之一是:更新视图而不重新请求页面;vue-router在实现单页面前端

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue中使用组件

    Vue笔记:Vue中使用组件

     转载:https://blog.csdn.net/YYxiaobao0726/article/details/86577481 根组件引入其他组件 前言  一个.vue 文件就是一个单独的组件。 在 .vue 文件中, template 中都是html 代码,它定义了在页面中显示的内容,由于里面还有变量,也可以说定义了一个模版; script中都是js

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue基础

    Vue笔记:Vue基础

        目录 前言 hello Vue Vue挂载 数据绑定 事件绑定 计算属性和侦听器 条件渲染、列表渲染 双向绑定   前言 Vue.js 是一套构建用户界面的渐进式框架,你可以选择使用它的一部分功能,也可以使用全部功能。 以下代码的环境:https://codepen.io/pen   hello Vue Vue.js是以JavaScrip作为

    日期 2023-06-12 10:48:40     
  • vue笔记

    vue笔记

        1.样式加scoped属性的作用: <style> 标签添加了 scoped 属性,只作用于当前组件中的元素, 2.如何更改第三方组件的样式:用/deep/ 使用深度作用选择器/deep/,使用方式:将/deep/ + space空格 添加在第三方样式类的前面。如果是使用less语法的话,直接在第

    日期 2023-06-12 10:48:40     
  • Vue3快速上手资料!手把手带你彻底学会Vue3,超详细讲解!不怕学不会!【建议收藏】【尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通vue3笔记资料】

    Vue3快速上手资料!手把手带你彻底学会Vue3,超详细讲解!不怕学不会!【建议收藏】【尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通vue3笔记资料】

    Vue3快速上手 1.Vue3简介 2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王) 耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者 github上的tags地址:Re

    日期 2023-06-12 10:48:40     
  • 【vuejs】2/5vue学习笔记

    【vuejs】2/5vue学习笔记

        ### 准备开始 ------ #### 学员反馈 凃凃老师, 该拓展的一定要拓展, 即使有部分同学跟起来吃力 , 以后工作很可能在项目中遇到相似问题, 至少知道老师讲过 , 有对照也好解决. 可以说清楚有哪些必须掌握, 有哪些让有余力的同学掌握. #### 复习 - vue单文件方式 xxx.vue - 1:准备好配置文件 pack

    日期 2023-06-12 10:48:40     
  • 【vuejs】1/5vue 学习笔记

    【vuejs】1/5vue 学习笔记

    代码:                         *************************** es6复习以及vue入门 ### 准备开始 ------ #### 学员反馈 下午感觉要起飞了,给我们点时间练一下 保留最终解释权 晕晕乎乎的一天就过去了 保留最终解释权

    日期 2023-06-12 10:48:40     
  • vue学习笔记

    vue学习笔记

    如果属性的值是html的代码,要想让代码解释为标签而不是原样输出,需要使用v-html指令,创建RenderHtmlApp.vue组件 <template> &

    日期 2023-06-12 10:48:40     
  • Vue八股文笔记自用1

    Vue八股文笔记自用1

    使用 Object.defineProperty() 来进行数据劫持有什么缺点? 在对对象添加属性或者通过下标方式修改数组时,Object.defineproperty无法监测到,V

    日期 2023-06-12 10:48:40     
  • 全面总结 Vue 3.0 的新特性!手把手教你如何入门Vue3.0(适合小白的保姆级教程)【尚硅谷vuejs3.0笔记】

    全面总结 Vue 3.0 的新特性!手把手教你如何入门Vue3.0(适合小白的保姆级教程)【尚硅谷vuejs3.0笔记】

    Vue3快速上手 1.Vue3简介 2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王) 耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者 github上的tags地址:Re

    日期 2023-06-12 10:48:40     
  • Vue学习笔记——Vue UI组件库

    Vue学习笔记——Vue UI组件库

    7.1 移动端常用 UI 组件库 Vant https://youzan.github.io/vantCube UI https://didi.github.io/cube-uiMint UI http://mint-ui

    日期 2023-06-12 10:48:40     
  • Vue学习笔记——Vue核心

    Vue学习笔记——Vue核心

    1.1 Vue简介 1.1.1.官网 英文官网: https://vuejs.org/中文官网: https://cn.vuejs.org 1.1.2.介绍与描述 动态构建用户界面的渐进式JavaScript框架作者

    日期 2023-06-12 10:48:40