样式 播放器 音乐vue
Vue3+.net6.0 八 监听器 watch,回调
有时候我们需要根据变量的变化去更改dom或者输出结果,也就是需要监听data部分,和Vue2一样,需要用到watch监听器。 简单例子,输入框绑定了context,当我们改变输入框的值时,watch里同名监听器context监听到了变化,通过判断新旧值是否有变化弹出提示。 需要注意的是: 1、监听器 ......
Vue3 遍历显示Json数组
在Vue项目中 遍历显示Json数组 以列表的形式显示的页面上 main.js 全局 json 对象 //全局json const globalData=reactive({ extTelTalkData: [ { userExten: "1000", userName: "刘亦菲", callSt ......
vue3 provide/inject使用
provide/inject 可解决深层组件传值问题 父组件 import { provide } from "vue"; const curValue = ref(props.modelValue); provide('curTabName',curValue); 子组件 import { inj ......
CSS滚动条样式
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ ::-webkit-scrollbar { width: 10px; /*滚动条宽度*/ height: 16px; /*滚动条高度*/ } /*定义滚动条轨道 内阴影+圆角*/ ::-webkit-scrollbar-track { -w ......
VUE|创建一个基础的VUE应用
## 1 应用实例 参考官方文档 [应用实例 API | Vue.js (vuejs.org)](https://cn.vuejs.org/api/application.html) > 示例 ```javascript const {createApp} = Vue // 通过createApp创 ......
js:http-vue-loader从浏览器直接引入vue文件
doc ``` github: https://github.com/FranckFreiburger/http-vue-loader ``` index.html ``` ``` my-component.vue ``` Hello {{who}} ``` 使用 sass ``` ``` 使用 l ......
【Qt-Material】适用于PySide6,PySide2,PyQt6以及PyQt6的仿Material样式
# Qt-Material 如题,更多内容详见:[Qt-Material](https://github.com/UN-GCPDS/qt-material) ## 安装 ```python pip install qt-material ``` ## 引用 ```python import sys ......
前端Vue自定义可自由滚动新闻栏tabs选项卡标签栏标题栏组件
随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。 通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率低,降低维护成本。 今天给 ......
key在vue中的作用与虚拟dom与diff算法
一。虚拟dom:(它是存在于内存中的) VNode的全称是Virtual Node,也就是虚拟节点;事实上,无论是组件还是元素,它们最终在Vue中表示出来的都是一个个VNode。VNode的本质是一个JavaScript对象。 其实虚拟Dom是真实Dom的一种状态。当真实Dom发生变化后,虚拟Dom ......
esp32笔记[5]-基于I2S协议实现音频播放
## 摘要 基于I2S协议实现音频播放,制作一个可以通过串口点播音频的语音播放模块。 ## 硬件平台 - ESP32-S3开发板 ```C //IO口 #define SPEAKER_WS 7 #define SPEAKER_SCK 16 #define SPEAKER_DATA 6 #define ......
vue-day26--引出生命周期
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>引出生命周 ......
vue-day25--自定义指令总结
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>自定义指令 ......
vue-day25--自定义指令v-fbind
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>自定义指令 ......
vue-day25--自定义指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>自定义指令 ......
vue-day25--v-pre指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>v-pre ......
vue-day25--v-once指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>v-onc ......
vue-day23--v-html指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>v-htm ......
前端Vue仿美团右侧侧边栏弹框筛选框popup alert
随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。 通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率低,降低维护成本。 今天给 ......
vue-day22--v-text指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>过滤器</ ......
Python MP3 文件下载(音乐下载)
# import requests class Music: def save(self,url): res=requests.get(url) with open('music.mp3','wb') as f: f.write(res.content) ......
vue -父子组件值传递
父组件:是指引用其他组件东西(这里叫attrgroup.vue) 子组件:是指被其他组件引用的东西(这里叫category.vue) 父组件引用子组件,如下: <template> <!-- tree 属性菜单 --> <!-- tree-node-click 是子组件自定义的事件,通过事件触发然后 ......
vue-day21-过滤器学习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>过滤器</ ......
vue.js浏览器插件
提取地址: 链接:https://pan.baidu.com/s/1Uf9yZaQfRQ1r2JvOxXX50A?pwd=l3iw 提取码:l3iw 加载已解压的扩展程序 ......
vue-day20---收集表单数据
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>收集表单数 ......
vue2
一.mvvm模型 MVVM 是 vue 实现数据驱动视图和双向数据绑定的核心原理。它把每个 HTML 页面都拆分成了如下三个部分: View 表示当前页面所渲染的 DOM 结构。 Model 表示当前页面渲染时所依赖的数据源。 ViewModel 表示 vue 的实例,它是 MVVM 的核心 1.为 ......
vue我自己的动态菜单思路
1、在router里把所有的路由都加上。 2、后端存储路由path和其他设计需要的信息。 3、登录后,后端返回菜单树,根据权限不同,返回的菜单不同,并且还要返回每个path代表的页面具有的权限数组。可以实现前端对权限的控制。 4、根据后端返回的菜单树的path,去过滤路由数组,即path对应相同的路 ......
vue-day19--Vue监测数据的原理--大综合练习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Vue监测 ......
vue-day18--vue监测数组
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>watch ......
vue--day17---Vue.set()
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>watch ......