VUE2及其生态查漏补缺

news2024/12/27 9:56:33

1、数据代理概括

数据代理过程相当于是进行了 vm 代理 vm_data中的属性，vm._data 是与 我们vue文件中写的 data是全等的

//创建Vue实例
			let data = { //data中用于存储数据，数据供el所指定的容器去使用，值我们暂时先写成一个对象。
					name:'atguigu',
					address:'北京'
				}
			new Vue({
				el:'#demo', //el用于指定当前Vue实例为哪个容器服务，值通常为css选择器字符串。
				data
			})

			Object.defineProperty(vm, 'name', {
				get(){
					return vm._data.name
				},
				set(value){
					vm._data.name = value
				}
			})

2、v-on:事件 

只有data里面的东西才会做数据劫持，代理，方法其实也可以写在data，但是会使vue实例变得冗余，因为对方法做了数据代理及劫持，这是没意义的操作

事件的基本使用：

      1.使用v-on:xxx 或 @xxx 绑定事件，其中xxx是事件名；

      2.事件的回调需要配置在methods对象中，最终会在vm上；

      3.methods中配置的函数，不要用箭头函数！否则this就不是vm了；

      4.methods中配置的函数，都是被Vue所管理的函数，this的指向是vm 或 组件实例对象；

       5.@click="demo" 和 @click="demo($event)" 效果一致，但后者可以传参；

 2.1、事件修饰符

Vue中的事件修饰符：

          1.prevent：阻止默认事件（常用）；

          2.stop：阻止事件冒泡（常用）；

          3.once：事件只触发一次（常用）；

          4.capture：使用事件的捕获模式,让事件在捕获阶段执行（默认事件是在冒泡阶段执行的）；

          5.self：只有event.target是当前操作的元素时才触发事件；

          6.passive：事件的默认行为立即执行，无需等待事件回调执行完毕；

2.2、键盘事件

1.Vue中常用的按键别名：

          回车 => enter

          删除 => delete (捕获“删除”和“退格”键)

          退出 => esc

          空格 => space

          换行 => tab (特殊，必须配合keydown去使用)

          上 => up

          下 => down

          左 => left

          右 => right

        2.Vue未提供别名的按键，可以使用按键原始的key值去绑定，但注意要转为kebab-case（短横线命名）

        3.系统修饰键（用法特殊）：ctrl、alt、shift、meta

          (1).配合keyup使用：按下修饰键的同时，再按下其他键，随后释放其他键，事件才被触发。

          (2).配合keydown使用：正常触发事件。

        4.也可以使用keyCode去指定具体的按键（不推荐）

        5.Vue.config.keyCodes.自定义键名 = 键码，可以去定制按键别名

3、列表渲染 key

最终效果图

操作步骤：

复制张三-18到其对应的右侧输入框

李四-19、王五-20同上操作

然后点击添加老刘就会得到上述的效果，具体原因在 下面 3.1 有解释

demo代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>key的原理</title>
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 准备好一个容器-->
		<div id="root">
			<!-- 遍历数组 -->
			<h2>人员列表（遍历数组）</h2>
			<button @click.once="add">添加一个老刘</button>
			<ul>
				<!-- 分别通过 index 与 id作为 key -->
				<li v-for="(p,index) of persons" :key="index">
					{{p.name}}-{{p.age}}
					<input type="text">
				</li>
			</ul>
		</div>

		<script type="text/javascript">
			Vue.config.productionTip = false
			
			new Vue({
				el:'#root',
				data:{
					persons:[
						{id:'001',name:'张三',age:18},
						{id:'002',name:'李四',age:19},
						{id:'003',name:'王五',age:20}
					]
				},
				methods: {
					add(){
						const p = {id:'004',name:'老刘',age:40}
						this.persons.unshift(p)
					}
				},
			})
		</script>
</html>

 3.1、index作为key

解释：

  1. 当index作为key的时候（没设置key时，默认也是以index作为key的）
  2. 我们一开始渲染的是左侧的三条数据，会生成三个虚拟dom节点，key 分别为0、1、2，
  3. 然后vue根据这三虚拟dom生成真正的三个dom节点，渲染到页面上去
  4. 当我们通过 unshift 逆序添加一个元素到列表时，破坏了原列表的顺序，生成四个虚拟节点
  5. vue会通过diff算法 将左侧（原本的）和右侧（新生成）的虚拟节点进行对比，主要是通过key，去对比
  6. 发现右侧key = 0的地方 文本节点与左侧key = 0的地方文本节点不一样，则在生成真实dom节点的时候，就会重新生成dom节点，对比input虚拟节点的时候，发现是一样的，则会复用已有的dom节点而此时，由于复用的是左侧key = 0 节点下的input，所以老刘对应的输入框本应是无值的变成了 张三-18,以此类推最终就会得到 右图所示的效果，出现数据错乱
  7. 而且如果是类似上述情况，涉及逆序破坏列表顺序的情况，使用idnex作为key，会造成效率问题，让本该复用的节点，得不到复用，重复创建dom节点，所以当是类似上述情况，使用唯一标识很重要，下面解释为啥使用唯一标识重要

3.2、唯一标识作为key

解释：

  1. 当唯一标识（这里是id）作为key的时候
  2. 我们一开始渲染的是左侧的三条数据，会生成三个虚拟dom节点，key 分别为001、002、003，
  3. 然后vue根据这三虚拟dom生成真正的三个dom节点，渲染到页面上去
  4. 当我们通过 unshift 逆序添加一个元素到列表时，破坏了原列表的顺序，生成四个虚拟节点
  5. vue会通过diff算法 将左侧（原本的）和右侧（新生成）的虚拟节点进行对比，主要是通过key，去对比
  6. 发现右侧key = 001的地方 文本节点与左侧key = 001的地方文本节点与input节点是一样的，则会复用已有的dom节点，此时就能正确显示，以此类推 002、003对应的节点杜能正确配对显示，所以就能得到我们想要的效果

4、vue监测数据改变的原理

引出问题

demo代码，注意要引入 vue.js (vue 2.xx.xx版本)

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>更新时的一个问题</title>
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 准备好一个容器-->
		<div id="root">
			<h2>人员列表</h2>
			<button @click="updateMei">更新马冬梅的信息</button>
			<ul>
				<li v-for="(p,index) of persons" :key="p.id">
					{{p.name}}-{{p.age}}-{{p.sex}}
				</li>
			</ul>
		</div>

		<script type="text/javascript">
			Vue.config.productionTip = false
			
			const vm = new Vue({
				el:'#root',
				data:{
					persons:[
						{id:'001',name:'马冬梅',age:30,sex:'女'},
						{id:'002',name:'周冬雨',age:31,sex:'女'},
						{id:'003',name:'周杰伦',age:18,sex:'男'},
						{id:'004',name:'温兆伦',age:19,sex:'男'}
					]
				},
				methods: {
					updateMei(){
						// this.persons[0].name = '马老师' //奏效
						// this.persons[0].age = 50 //奏效
						// this.persons[0].sex = '男' //奏效

						this.persons[0] = {id:'001',name:'马老师',age:50,sex:'男'} //不奏效
						// this.persons.splice(0,1,{id:'001',name:'马老师',age:50,sex:'男'}) // 奏效
					}
				}
			}) 

		</script>
</html>

一个属性一个属性的更改是可以检测到的，但是当是数组的整个对象更新的时候，就不行 

临时添加的对象属性，也不具有响应式（因为没有通过Object.defineProperty 进行劫持），除非使用$set添加的 （$set就相当于是重新使用 Object.defineProperty 进行数据劫持）

数组通过索引更改值，vue也检测不到，页面也不会实时更新(当然也可以使用set，就可以检测到了)，必须通过数组的七个方法更新数组(push、pop、unshift、shift、splice、sort、reverse)，vue才能检测到，因为vue对上述方法进行了重写

$set局限性不能vue实例/根数据对象身上使用 set, 会报错：避免添加响应式属性到xxx

5、其他

5.1、v-model 相关的三个修饰符

v-model的三个修饰符：

           lazy：失去焦点再收集数据

           number：输入字符串转为有效的数字

           trim：输入首尾空格过滤

5.2、过滤器

过滤器：

        定义：对要显示的数据进行特定格式化后再显示（适用于一些简单逻辑的处理）。

        语法：

            1.注册过滤器：Vue.filter(name,callback) 或 new Vue{filters:{}}

            2.使用过滤器：{{ xxx | 过滤器名}}  或  v-bind:属性 = "xxx | 过滤器名"

        备注：

            1.过滤器也可以接收额外参数、多个过滤器也可以串联

            2.并没有改变原本的数据, 是产生新的对应的数据

5.3、内置指令

v-text指令：

            1.作用：向其所在的节点中渲染文本内容。

            2.与插值语法的区别：v-text会替换掉节点中的内容，{{xx}}则不会。

v-html（慎用）

因为有了可能会在指令后面的内容中，插入一些获取 cookie的操作（document.cookie），这样就会导致xss攻击，也就是类似仿冒的操作，如果服务器返回的cookie 没有设置成 httpOnly ，则可以通过document.cookie 获取到，攻击者就可以获取到cookie，v-html 就有可能会带有，类似获取cookie，然后发送到攻击者的服务器的操作，所以如果要使用v-html 一定要确保是可信的，并进行相应的校验

 v-once 只加载一次，后续相关值改变， 此处值不作变更

  v-once指令：

            1.v-once所在节点在初次动态渲染后，就视为静态内容了。

            2.以后数据的改变不会引起v-once所在结构的更新，可以用于优化性能。

 v-pre

v-pre指令：

          1.跳过其所在节点的编译过程。

          2.可利用它跳过：没有使用指令语法、没有使用插值语法的节点，会加快编译。

5.4、自定义指令

自定义指令总结：

            一、定义语法：

                  (1).局部指令：

                        new Vue({                          

                            directives{指令名:回调函数}

                        })                                 

                  (2).全局指令：

                          Vue.directive(指令名,配置对象) 或   Vue.directive(指令名,回调函数)

            二、配置对象中常用的3个回调：

                  (1).bind：指令与元素成功绑定时调用。

                  (2).inserted：指令所在元素被插入页面时调用。

                  (3).update：指令所在模板结构被重新解析时调用。

            三、备注：

                  1.指令定义时不加v-，但使用时要加v-；

                  2.指令名如果是多个单词，要使用kebab-case命名方式，不要用camelCase命名。

指令可以分为函数式写法与对象式写法

new Vue({
			el:'#root',
			data:{
				name:'尚硅谷',
				n:1
			},
			directives:{
				big(element,binding){
					console.log('big',this) //注意此处的this是window
					// console.log('big')
					element.innerText = binding.value * 10
				},
				fbind:{
					//指令与元素成功绑定时（一上来）
					bind(element,binding){
						element.value = binding.value
					},
					//指令所在元素被插入页面时
					inserted(element,binding){
						element.focus()
					},
					//指令所在的模板被重新解析时
					update(element,binding){
						element.value = binding.value
					}
				}
			}
		})

函数式写法就相当于只写了bind 与 update， 向上面这样bind、inserted、update都写，一些小细节的东西才能处理

5.5、Vm 与 Vc

关于this指向：

                (1).组件配置中：

                      data函数、methods中的函数、watch中的函数、computed中的函数 它们的this均是【VueComponent实例对象】。

                (2).new Vue(options)配置中：

                      data函数、methods中的函数、watch中的函数、computed中的函数 它们的this均是【Vue实例对象】。

Vm是指Vue实例， Vc是指VueComponent实例，一般Vm中的$children 会有相应的Vc实例，如果是嵌套组件，则其下也会有$children  也会有Vc实例， Vm 与 Vc基本长一个样 ，且Vm创建的时候又el配置项用于指定服务于那个容器，而Vc则没有

1.一个重要的内置关系：VueComponent.prototype.__proto__ === Vue.prototype

2.为什么要有这个关系：让组件实例对象（vc）可以访问到 Vue原型上的属性、方法。

5.6、插件

 写法 plugins.js

export default {
	install(Vue,x,y,z){
		console.log(x,y,z)
		//全局过滤器
		Vue.filter('mySlice',function(value){
			return value.slice(0,4)
		})

		//定义全局指令
		Vue.directive('fbind',{
			//指令与元素成功绑定时（一上来）
			bind(element,binding){
				element.value = binding.value
			},
			//指令所在元素被插入页面时
			inserted(element,binding){
				element.focus()
			},
			//指令所在的模板被重新解析时
			update(element,binding){
				element.value = binding.value
			}
		})

		//定义混入
		Vue.mixin({
			data() {
				return {
					x:100,
					y:200
				}
			},
		})

		//给Vue原型上添加一个方法（vm和vc就都能用了）,但是一般不这么做，需要慎重考虑
		Vue.prototype.hello = ()=>{alert('你好啊')}
	}
}

在项目入口文件中引入安装一下

import Vue from 'vue'
//引入App
import App from './App.vue'
//引入插件
import plugins from './plugins'
//关闭Vue的生产提示
Vue.config.productionTip = false

//应用（使用）插件
Vue.use(plugins,1,2,3)
//创建vm
new Vue({
	el:'#app',
	render: h => h(App)
})

经过上面操作，这些定义好的过滤器、指令、mixin就可以全局使用了

5.7、npm 查看依赖版本

5.8、解决跨域方法

  •  服务端设置cors
  • jsonp，需要前后端配置，且只能处理get请求
  • 脚手架/打包工具 代理
  • nginx代理

6、生命周期

6.1、原理图

常用的生命周期钩子：

            1.mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】。

            2.beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】。

        关于销毁Vue实例

            1.销毁后借助Vue开发者工具看不到任何信息。

            2.销毁后自定义事件会失效，但原生DOM事件依然有效。

            3.一般不会在beforeDestroy操作数据，因为即便操作数据，也不会再触发更新流程了。

7、事件总线

1、Vue原型对象上包含事件处理的方法

1)$on(eventName,listener):绑定自定义事件监听

2)$emit(eventName,data):分发自定义事件

3)$off(eventName):解绑自定义事件监听4)

$once(eventName,listener):绑定事件监听,但只能处理一次

2、所有组件实例对象的原型对象的原型对象就是Vue的原型对象

1)所有组件对象都能看到Vue原型对象上的属性和方法

2)Vue.prototype.$bus=newVue(),所有的组件对象都能看到$bus这个属性对象

 事件总线其实大概就是这样一个东西

new Vue({
	el:'#app',
	render: h => h(App),
	beforeCreate() {
		Vue.prototype.$bus = this //安装全局事件总线
	},
})

8、Vuex

8.1、基础使用

vuex官网 都是使用

但是需要注意是，vue开发者工具只能检测到mutation 的动作

mapState、mapGetters使用

computed:{
			//靠程序员自己亲自去写计算属性
			/* sum(){
				return this.$store.state.sum
			},
			school(){
				return this.$store.state.school
			},
			subject(){
				return this.$store.state.subject
			}, */

			//借助mapState生成计算属性，从state中读取数据。（对象写法）
			// ...mapState({he:'sum',xuexiao:'school',xueke:'subject'}),

			//借助mapState生成计算属性，从state中读取数据。（数组写法）
			...mapState(['sum','school','subject']),

			/* ******************************************************************** */

			/* bigSum(){
				return this.$store.getters.bigSum
			}, */

			//借助mapGetters生成计算属性，从getters中读取数据。（对象写法）
			// ...mapGetters({bigSum:'bigSum'})
			
			//借助mapGetters生成计算属性，从getters中读取数据。（数组写法）
			...mapGetters(['bigSum'])

		},

mapMutations、mapActions 

methods: {
			//程序员亲自写方法
			/* increment(){
				this.$store.commit('JIA',this.n)
			},
			decrement(){
				this.$store.commit('JIAN',this.n)
			}, */

			//借助mapMutations生成对应的方法，方法中会调用commit去联系mutations(对象写法)
			...mapMutations({increment:'JIA',decrement:'JIAN'}),

			//借助mapMutations生成对应的方法，方法中会调用commit去联系mutations(数组写法)
			// ...mapMutations(['JIA','JIAN']),

			/* ************************************************* */

			//程序员亲自写方法
			/* incrementOdd(){
				this.$store.dispatch('jiaOdd',this.n)
			},
			incrementWait(){
				this.$store.dispatch('jiaWait',this.n)
			}, */

			//借助mapActions生成对应的方法，方法中会调用dispatch去联系actions(对象写法)
			...mapActions({incrementOdd:'jiaOdd',incrementWait:'jiaWait'})

			//借助mapActions生成对应的方法，方法中会调用dispatch去联系actions(数组写法)
			// ...mapActions(['jiaOdd','jiaWait'])
		},

模块化开发

 模块化的作用，顾名思义就是模块化，减少在同事间在协作的过程中可能会出现的冲突，代码结构更清晰，方便维护

9、vue-router

官网

9.1、params参数 

携带 params 参数进行路由跳转，必须使用 name，不能使用path

若路由定义了 props: true 则会将params 作为组件的props，可以在组件里面通过prosp获取

若props 直接返回对象也可以，也可以写成函数形式

 路由跳转方式：声明式导航 router-link、编程式导航，router.push/replace

9.2、路由守卫

全局路由守卫

//全局前置路由守卫————初始化的时候被调用、每次路由切换之前被调用
router.beforeEach((to,from,next)=>{
	console.log('前置路由守卫',to,from)
	if(to.meta.isAuth){ //判断是否需要鉴权
		if(localStorage.getItem('school')==='atguigu'){
			next()
		}else{
			alert('学校名不对，无权限查看！')
		}
	}else{
		next()
	}
})

//全局后置路由守卫————初始化的时候被调用、每次路由切换之后被调用
router.afterEach((to,from)=>{
	console.log('后置路由守卫',to,from)
	document.title = to.meta.title || '管理系统'
})

路由独享守卫

{
			name:'zhuye',
			path:'/home',
			component:Home,
			meta:{title:'主页'},
			children:[
				{
					name:'xinwen',
					path:'news',
					component:News,
					meta:{isAuth:true,title:'新闻'},
					beforeEnter: (to, from, next) => {
						console.log('独享路由守卫',to,from)
						if(to.meta.isAuth){ //判断是否需要鉴权
							if(localStorage.getItem('school')==='xxxx'){
								next()
							}else{
								alert('学校名不对，无权限查看！')
							}
						}else{
							next()
						}
					}
				}
}

组件内路由守卫

export default {
		name:'About',
		/* beforeDestroy() {
			console.log('About组件即将被销毁了')
		},*/
		/* mounted() {
			console.log('About组件挂载完毕了',this)
			window.aboutRoute = this.$route
			window.aboutRouter = this.$router
		},  */
		mounted() {
			// console.log('%%%',this.$route)
		},

		//通过路由规则，进入该组件时被调用
		beforeRouteEnter (to, from, next) {
			console.log('About--beforeRouteEnter',to,from)
			if(to.meta.isAuth){ //判断是否需要鉴权
				if(localStorage.getItem('school')==='xxxxx'){
					next()
				}else{
					alert('学校名不对，无权限查看！')
				}
			}else{
				next()
			}
		},

		//通过路由规则，离开该组件时被调用
		beforeRouteLeave (to, from, next) {
			console.log('About--beforeRouteLeave',to,from)
			next()
		}
	}

路由模式

hash 与 history

history 会将路由地址，当做请求资源的地址，所以会出现404问题，需要后端去做适配，区别那些前段路由，那些是后端路由才行 ，而hash就不会出现这个问题

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1884814.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

[C++][设计模式][迭代器模式]详细讲解

[C++][设计模式][迭代器模式]详细讲解

目录 1.动机2.模式定义3.要点总结4.代码感受 1.动机 在软件构建过程中&#xff0c;集合对象内部结构常常变化各异。但对于这些集合对象&#xff0c;我们希望不暴露其内部结构的同时&#xff0c;可以让外部客户代码透明地访问其中包含的元素&#xff1b; 同时这种”透明遍历“也…
阅读更多...
每天五分钟深度学习：解决for循环效率慢的关键在于向量化

每天五分钟深度学习：解决for循环效率慢的关键在于向量化

本文重点 上一节课程中，我们学习了多样本的线性回归模型，但是我们的伪代码实现中使用了大量的for循环，这样代码的问题是效率很低。为了克服这一瓶颈，向量化技术应运而生，成为提升程序执行效率、加速数据处理速度的重要手段。 向量化技术概述 向量化（Vectorization）是…
阅读更多...
DC/AC电源模块：为智能家居设备提供恒定的电力供应

DC/AC电源模块：为智能家居设备提供恒定的电力供应

BOSHIDA DC/AC电源模块&#xff1a;为智能家居设备提供恒定的电力供应 DC/AC电源模块是一种常见的电源转换器&#xff0c;它将直流电源&#xff08;DC&#xff09;转换为交流电源&#xff08;AC&#xff09;&#xff0c;为智能家居设备提供恒定的电力供应。在智能家居系统中&a…
阅读更多...
用 AI 生成绘本，含大量 prompt

用 AI 生成绘本，含大量 prompt

画图过程&#xff0c;为了保证绘本输出的风格统一&#xff0c;角色连贯&#xff0c;画面内容与故事保持一致 1、画风统一的解决办法&#xff1a;固定一个插画师的风格&#xff0c;可以输入插画师的名字&#xff0c;或者垫图&#xff0c;即上传你需要借鉴风格的图片 2、角色连贯…
阅读更多...
探索IT世界的第一步：高考后的暑期学习指南

探索IT世界的第一步：高考后的暑期学习指南

目录 前言1. IT领域概述1.1 IT领域的发展与现状1.2 IT领域的主要分支1.2.1 软件开发1.2.2 数据科学1.2.3 网络与安全1.2.4 系统与运维 2. 学习路线图2.1 基础知识的学习2.1.1 编程语言2.1.2 数据结构与算法 2.2 实战项目的实践2.2.1 个人项目2.2.2 团队项目 2.3 学习资源的利用…
阅读更多...
高考假期预习指南，送给迷茫的你

高考假期预习指南，送给迷茫的你

高考结束&#xff0c;离别了熟悉的地方&#xff0c;踏上远方。 你&#xff0c;&#xff0c;迷茫吗&#xff1f; 大学是什么&#xff1f;到了大学我该怎样学习&#xff1f;真像网上说的毕业即失业吗&#xff1f; 大学是一个让你学会一技之长的地方&#xff0c;到了大学找到自…
阅读更多...
非平稳信号的自适应局部迭代滤波（MATLAB）

非平稳信号的自适应局部迭代滤波（MATLAB）

仍以滚动轴承故障诊断为例&#xff0c;在滚动轴承的运行过程中&#xff0c;其振动信号包含了大量的系统运行状态信息。利用振动信号进行滚动轴承的故障诊断&#xff0c;实际上就是分析振动信号、提取信息的过程。由于非线性力的作用&#xff0c;滚动轴承的故障信号往往是非平稳…
阅读更多...
为什么需要做网络安全服务？

为什么需要做网络安全服务？

网络安全服务之所以重要&#xff0c;是因为它在保护数字资产、维护企业运营、确保法规遵从、防范恶意行为以及建立信任等方面扮演着关键角色。以下是一些主要的理由&#xff1a; 保护核心资产和数据&#xff1a; 数字化转型使得企业数据变得极其宝贵&#xff0c;包括知识产权、…
阅读更多...
离散模态信息作为细粒度标记用于多模态知识图谱补全--MyGO

离散模态信息作为细粒度标记用于多模态知识图谱补全--MyGO

多模态知识图谱&#xff08;MMKG&#xff09;存储了包含有丰富的多模态描述信息的、结构化的世界知识。为了克服其固有的不完整性&#xff0c;多模态知识图谱补全&#xff08;MMKGC&#xff09;希望利用三元组的结构信息及实体的多模态信息&#xff0c;从给定的MMKG中发掘未观察…
阅读更多...
智能工厂解决方案—智能数据采集平台

智能工厂解决方案—智能数据采集平台

智慧工厂总体架构图 由智能化生产、智能化管理和产业链互联三个层面构成，前两个层面立足于企业自身，以智能工厂为建设目标，实习企业机体自身的智能化，而产业链互联则是以互联网技术为基础，将企业融入到产业链的整体生态环境中，逐步实现制造资源的服务化和云化，并与生态系…
阅读更多...
爬数据是什么意思？

爬数据是什么意思？

爬数据的意思是&#xff1a;通过网络爬虫程序来获取需要的网站上的内容信息&#xff0c;比如文字、视频、图片等数据。网络爬虫&#xff08;网页蜘蛛&#xff09;是一种按照一定的规则&#xff0c;自动的抓取万维网信息的程序或者脚本。 学习一些爬数据的知识有什么用呢&#x…
阅读更多...
SAP 接口-银行账号主数据维护接口【MDM-＞SAP】开发说明书（包括测试样例、程序代码仅作参考，不保证一定可以运行)

SAP 接口-银行账号主数据维护接口【MDM-＞SAP】开发说明书（包括测试样例、程序代码仅作参考，不保证一定可以运行)

接口映射字段 开发通用说明 根据MDM传输字段调用BAPI生成银行账号及开户行。 开户行维护BAPI【BAPI_BANK_CREATE】 银行账号维护BAPI【BAPI_FCLM_BAM_AMD_BNKANT】 接口字段【ZZZH 主账户标识】=1时字段【DTAAI】DME标识赋值：常用； 接口字段【ZZZH 主账户标识】=0时字段…
阅读更多...
mysql中的递归函数recursive

mysql中的递归函数recursive

递归部门 WITH recursive dept_tree AS (SELECTsd.mine_id AS mine_id,sd.dept_id AS dept_id,sd.tenant_id AS tenant_id,sd.order_num,sd.dept_name AS topName,sd.dept_id AS topIdFROMsys_dept sdWHERE<!-- 加上or后也会查询出dept节点 sd.parent_id #{deptId} or sd.…
阅读更多...
关于电商平台分类||电商平台商品分类接口|电商平台商品数据

关于电商平台分类||电商平台商品分类接口|电商平台商品数据

电商平台 做电商&#xff0c;则要有电商平台&#xff0c;一个为 企业 或 个人 提供网上交易洽谈的平台。. 企业电子商务平台是建立在 Internet 网上进行商务活动的虚拟网络空间和保障商务顺利运营的管理环境&#xff1b;是协调、整合 信息流 、货物流、 资金流 有序、关联、高效…
阅读更多...
【深度学习】pytorch训练中的一个大坑

【深度学习】pytorch训练中的一个大坑

使用的命令&#xff1a;iostat -x 5 可以看到 ssd的利用率已经满了。 之前在的数据集放在了 hdd上&#xff0c;训练结果特别慢。 所以我把它移动到了ssd上&#xff0c;然后训练参数用的 resume&#xff0c; 但是&#xff01;&#xff01;&#xff01;&#xff01;它把历史记住…
阅读更多...
音乐：触动心灵的艺术语言

音乐：触动心灵的艺术语言

Enjoy your music 音 乐 作为一种跨越时空和文化的艺术形式&#xff0c;拥有着无穷的魅力和力量。 它不仅能够带给我们愉悦的听觉享受&#xff0c;还对我们的身心健康、认知发展和社会交往产生着深远的影响。 一、音乐的基本元素 音乐由多个基本元素构成&#xff0c;包括…
阅读更多...
【MySQL备份】Percona XtraBackup全量备份实战篇

【MySQL备份】Percona XtraBackup全量备份实战篇

目录 1. 前言 2.准备工作 2.1.创建备份目录 2.2.配置/etc/my.cnf文件 2.3.授予root用户BACKUP_ADMIN权限 3.全量备份 4.准备备份 5.数据恢复 6.总结 "实战演练&#xff1a;利用Percona XtraBackup执行MySQL全量备份操作详解" 1. 前言 本文将继续上篇【My…
阅读更多...
【FFmpeg】av_read_frame函数

【FFmpeg】av_read_frame函数

目录 1.av_read_frame1.2 从pkt buffer中读取帧&#xff08;avpriv_packet_list_get&#xff09;1.3 从流当中读取帧&#xff08;read_frame_internal&#xff09;1.3.1 读取帧&#xff08;ff_read_packet&#xff09;1.3.2 解析packet&#xff08;parse_packet&#xff09;1.3…
阅读更多...
方正小标宋简体、仿宋GB2312、楷体GB2312字体

方正小标宋简体、仿宋GB2312、楷体GB2312字体

文章目录 下载地址所有的文件wps使用方正小标宋简体、仿宋GB2312、楷体GB2312 字体用途方正小标宋简体仿宋GB2312楷体GB2312 下载地址 【金山文档 | WPS云文档】 方正小标宋简体、仿宋GB2312、楷体GB2312 https://kdocs.cn/l/cksgHDLneqDk 所有的文件 wps使用 方正小标宋简体…
阅读更多...
Java高级重点知识点-18-线程

Java高级重点知识点-18-线程

文章目录 多线程线程线程安全线程状态线程间通信线程池 多线程 并发与并行 并发&#xff1a;指两个或多个事件在同一个时间段内发生。并行&#xff1a;指两个或多个事件在同一时刻发生&#xff08;同时发生&#xff09;。 对于单核CPU系统中&#xff0c;我们可以同时运行多个…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023