桌面端后台项目笔记

news2024/11/23 2:18:40

套用模板

vue-pure-admin

所用主要框架笔记

1. electron

app

const { app } = require('electron')
app.on('事件名', () => {} // 回调函数)
常用事件
  1. will-finish-launching 当应用程序完成基础的启动的时候触发
  2. ready:electron完成初始化时触发
  3. window-all-closed 所有窗口都被关闭时触发
  4. before-quit 在程序关闭窗口前触发 会返回event 调用event.preventDefault() 将阻止终止应用程序的默认行为
  5. will-quit 在所有窗口被关闭时触发
  6. quit 应用程序退出时触发
  7. open-file 当用户想要在应用中打开一个文件时触发 在windows中 process.argv可以获取文件路径
  8. open-url 当用户想要在应用中打开一个url时触发
方法
  • app.quit() 尝试关闭所有窗口 会触发before-quit事件
  • app.exit([exitcode]) 如果使用exitcode默认退出 不会询问用户
  • app.relaunch() 重启应用 此方法不会退出当前应用程序 需要在调用此方法后 在调用app.quit来重启应用
  • app.hide() 隐藏所有的应用窗口
  • app.show() 显示隐藏后的应用程序窗口
  • app.getAppPath() app.getAppPath()
  • app.getPath(name) 可以通过名称请求以下路径
  • 可以通过名称请求以下路径 可以通过名称请求以下路径
  • app.whenReady() 当electron初始化完成时触发
  • app.getVersion() 加载应用程序的版本号
  • app.getName() 当前应用程序的名称

BrowserView

// 在主进程中.
const { app, BrowserView, BrowserWindow } = require('electron')

app.whenReady().then(() => {
  const win = new BrowserWindow({ width: 800, height: 600 })

  const view = new BrowserView()
  win.setBrowserView()
  view.setBounds({ x: 0, y: 0, width: 300, height: 300 })
  view.webContents.loadURL('https://electronjs.org')
})
  • view.webContents 试图的webcontents对象
  • view.setAutoResize([options]) 窗口自动缩放设置
  • view.setBounds(bounds) 调整视图的大小,并将它移动到窗口边界
  • view.setBackgroundColor(color)

BrowserWindow

  • 优雅显示窗口两种方案
  1. ready-to-show事件
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ show: false })
win.once('ready-to-show', () => {
  win.show() // 初始化完成后在显示
})
  1. 设置backgroundColor属性(建议使用这个方法 更接近原生 )
const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ backgroundColor: '#2e2c29' })
win.loadURL('https://github.com')
  • new BrowserWindow([options])
app.whenReady().then(() => {
  win = new BrowserWindow({
    width: 1024, // 窗口的宽度
    height: 768, // 窗口的高度
    x: 10, // 窗口相对于屏幕左侧的偏移量 如果有y 为必选 默认是窗口居中
    y: 10, // 窗口相对于屏幕顶端的偏移量 默认是窗口居中
    useContentSize: false, // 窗口的实际尺寸是否为web页面的尺寸,如果是true包括窗口边框的大小 稍微会大点 默认是false
    center: true, // 窗口是否在屏幕居中
    minWidth: 1024, // 窗口的最小宽度
    minHeight: 768, // 窗口的最小高度
    maxWidth: 1024, // 窗口的最大宽度
    maxHeight: 790, // 窗口的最大高度
    title: "Main window",
    resizable: true, // 窗口大小是否可调整
    movable: true, // 窗口是否可移动
    minimizable: true, // 窗口是否可最小化
    maximizable: true, // 窗口是否可以最大化
    closable: true, // 窗口是否可关闭
    focusable: true, // 窗口是否可聚焦,
    alwaysOnTop: true, // 窗口是否永远在别的窗口之上
    fullscreen: true, // 窗口是否全屏
    skipTaskbar: true, // 是否在任务栏中显示窗口
    backgroundColor: "#FFF", // 窗口背景色
    hasShadow: true, // 窗口是否有阴影
    opacity: 1, // 窗口的透明度
    icon: join(process.env.PUBLIC, "favicon.ico"),
    webPreferences: {
      // 网页功能设置。
      preload, // 在页面运行其他脚本之前预先加载指定的脚本 无论页面是否集成Node, 此脚本都可以访问所有Node API 脚本路径为文件的绝对路径
      // Warning: Enable nodeIntegration and disable contextIsolation is not secure in production
      // Consider using contextBridge.exposeInMainWorld
      // Read more on https://www.electronjs.org/docs/latest/tutorial/context-isolation
      nodeIntegration: true, // 是否启用Node integration
      contextIsolation: false // 是否在独立 JavaScript 环境中运行 Electron API和指定的preload 脚本.
      // ...
    }
    // ...
  });
})

Menu

创建原生应用菜单和上下文菜单

const menu = new Menu() // 创建新菜单

// 静态方法
// 返回应用程序菜单
getApplicationMenu.getApplicationMenu()

// 返回menu template是一个数组 用于构建menuItem
Menu.buildFromTemplate(template)

// 在macOS上将 menu设置成应用内菜单 在windows和Linux上,menu 将会被设置成窗口顶部菜单
Menu.setApplicaionMenu(menu)

MenuItem选项说明
详细文档

  • click函数 click点击事件
  • role 定义菜单项的操作 例如undo、redo等等
  • type:类型
  • label 文本
  • tooltip菜单项的悬浮文本
  • icon

clipboard

在系统剪贴板上执行复制和粘贴操作
const { clipboard } = require('electron')

  • 方法
    • clipboard.readText() 读取剪贴板内容
    • clipboard.writeText(text. [type]) // 将txt写入剪贴板

session

管理浏览器回话、cookie、缓存、代理设置等

  • 方法
    • getCacheSize 当前session会话缓存大小
    • clearCache 当缓存清除操作完成时可获取 清除session的HTTP缓存

cookies

通过Session的cookies属性来访问Cookies的实例

const { session } = require('electron')
const { session } = require('electron')

// 查询所有 cookies。
session.defaultSession.cookies.get({})
  .then((cookies) => {
    console.log(cookies)
  }).catch((error) => {
    console.log(error)
  })

// 查询所有与设置的 URL 相关的所有 cookies.
session.defaultSession.cookies.get({ url: 'http://www.github.com' })
  .then((cookies) => {
    console.log(cookies)
  }).catch((error) => {
    console.log(error)
  })

// 设置一个 cookie,使用设置的名称;
// 如果存在,则会覆盖原先 cookie.
const cookie = { url: 'http://www.github.com', name: 'dummy_name', value: 'dummy' }
session.defaultSession.cookies.set(cookie)
  .then(() => {
    // success
  }, (error) => {
    console.error(error)
  })

2. vite4

文档

搭建vite项目

npm create vite@latest | npm create vite@latest | pnpm create vite

功能

通过原生ESM导入提供了许多主要用于打包场景的增强功能
vite天然支持引入.ts文件 仅支持转椅 不执行任何类型检查 可以通过tsc --noEmit --watch查看IDE提示 vite-plugin-checker插件可以在浏览器直接看到上报的类型错误
模块热替换:内置HMR api可以及时准确更新 无需重新加载页面 自动配置了

WebWorkers

一个web worker 可以使用 new Worker()new SHareWorker()导入
推荐使用的导入worker用法

const worker = new Worker(new URL('./worker.js', import.meta.url))

worker构造函数还有用来创建模块worker的选项

const worker = new Worker(new URL('./worker.js', import.meta.url), {
  type: 'module',
})

通过?worker或者?sharedworker查询参数来直接导入一个web worker脚本

import Myworker from './worker?worker'
const worker = new Muworker()
// worker内联成base64字符串
import MyWorker from './worker?worker&inline'

环境变量

vite在一个特殊的import.meta.env对象上暴露环境变量

  • import.meta.env.MODE 应用运行的模式 deveploment(开发) production(生产)
  • import.meta.env.BASE_URL: 部署应用时的基本url
  • import.meta.env.PROD: 是否在生产环境
  • import.meta.env.DEV: 是否在开发环境
  • import.meta.env.SSR: 是否在server上

插件配置

// vite.config.js
import vitePlugin from 'vite-plugin-feature'
import rollupPlugin from 'rollup-plugin-feature'

export default defineConfig({
  plugins: [vitePlugin(), rollupPlugin()],
})

配置vite

当以命令行方式运行vite时,vite会自动解析vite.config.js文件

import { defineConfig, loadEnv } from 'vite'

export default defineConfig(({command, mode, ssrBuild}) => {
	//环境变量可以从process.env获得但是默认vite是不加载.env的 所有可以通过loadEnv来加载
	const env = loadEnv(mode, process.cwd(), '')
	if (command === 'serve') {
	    return {
	      root: '', // 项目根目录 默认: process.cwd()
	      base: '/', // 开发或者生产环境的公共基础路径
	      mode: 'development', // 环境
	      
		  server: { // 服务器选项
		  	hmr: true, // 热重载
		  	host: 'localhost', // 指定服务器应该监听哪个 IP 地址
		  	port: '8080', // 指定开发服务器端口
		  	strictPort: false, // 端口被占用是否退出
		  	https: true, // 是否启用TLS+http/2
		  	open: true, // 开发服务器启东市,自动在浏览器打开应用程序吗
		  	proxy: { // 为开发服务器配置自定义代理规则 跨域代理
	  		  '/foo': 'http://localhost:4567',
		      '/api': {
		        target: 'http://jsonplaceholder.typicode.com',
		        changeOrigin: true,
		        rewrite: (path) => path.replace(/^\/api/, ''),
		      },
		  	},
		  	cors: {}, // 为开发服务器配置 CORS
		  },
		  optimizeDeps: {}, // 依赖优化选项		
		  ssr: {},    // ssr选项
   		  build: {
		      target: "modules", // 设置最终构建的浏览器兼容目标
		      outDir: "dist", // 指定输出路径
		      cssCodeSplit: true, // css代码是否拆分
		      sourcemap: false, // 是否生成source map
		      ssr: false, // 是否服务端渲染
		      reportCompressedSize: true, // 启用/禁用 gzip 压缩大小报告
		      // 消除打包大小超过500kb警告
		      chunkSizeWarningLimit: 4000,
		      rollupOptions: {
		        input: {
		          index: pathResolve("index.html")
		        },
		        // 静态资源分类打包
		        output: {
		          chunkFileNames: "static/js/[name]-[hash].js",
		          entryFileNames: "static/js/[name]-[hash].js",
		          assetFileNames: "static/[ext]/[name]-[hash].[ext]"
		        }
		      }
	      },
	      // 定义全局常量替换方式
	      define: {
	      	__APP_ENV__: env.APP_ENV
	      },
	      plugins: [], // 插件数组
	      publickDir: 'public', // 相对于项目根目录的相对路径
	      cacheDir, // 存储缓存文件的目录
	      resolve: {
	      	alias: {}, // 配置别名
	      	dedupe: [],
	      	browserField: true, // 是否启用对 browser 字段的解析
	      },
	      rollupOptions: false, // 设为 false 可以避免 Vite 清屏而错过在终端中打印某些关键信息。命令行模式下可以通过 --clearScreen false 设置。
	    }
  	} else {
	    // command === 'build'
	    return {
	      // build 独有配置
	    }
  	}

})

3. pinia

官方推荐pinia的原因

在这里插入图片描述

特点

  • vue2和vue3都支持
  • devtools支持追踪actions、mutations的时间线 在组件中展示store
  • 热更新
  • 可通过插件扩展pinia功能
  • 针对ts提供了更完善的类型推导
  • 支持服务端渲染

使用

安装
yarn add pinia
vue3使用

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'

const pinia = createPinia()
const app = createApp(App)

app.use(pinia)
app.mount('#app')

核心概念

1. 定义store

通过defineStore()定义,他的第一个参数要求是一个独一无二的名字
这个名字 也被用作id,是必须传入的,pinia将用它来连接store和devtools

// 写法一
import { defineStore } from 'pinia'
export const noteStore = defineStore('note', { // 参数
	state: () => ({ count: 0 }),
	getters: {
		double: () => state.count * 2
	},
	actions: {
		increment() {
			this.count++
		}
	}
})

// 写法二
export const useCounterStore = defineStore('counter', () => {
  const count = ref(0) // 相当于定义state
  function increment() { // actions
    count.value++
  }

  return { count, increment }
})

2. 使用store

// 不是响应式的store
<script setup>
import { useCounterStore } from '@/stores/counter'
// 可以在组件中的任意位置访问 `store` 变量 ✨
const store = useCounterStore()
</script>

// 响应式的store storeToRefs
<script setup>
import { storeToRefs } from 'pinia'
const store = useCounterStore()
// `name` 和 `doubleCount` 是响应式的 ref
// 同时通过插件添加的属性也会被提取为 ref
// 并且会跳过所有的 action 或非响应式 (不是 ref 或 reactive) 的属性
const { name, doubleCount } = storeToRefs(store)
// 作为 action 的 increment 可以直接解构
const { increment } = store
</script>

3. state

import { defineStore, mapState, mapWritableState } from "pinia";
export const useTestStore = defineStore("test", {
  state: () => {
    return {
      // 所有属性都会自动推断他们的类型
      a: 1,
      b: 2
    };
  }
});

// 获取state
const store = useTestStore();
console.log(store.a++); 
// 重置state
store.$reset(); 

// vue文件中
computed: {
  ...mapState(useTestStore, ['a']) // 将state设置成只读的计算属性
  ...mapWritableState(useTestStore, ['a']) // 可以修改的state属性
}

// 变更state
store.$patch({
  a: store.a++
})

4. getter

js

export const useStore = defineStore('main', {
  state: () => ({
    count: 0,
  }),
  getters: {
    // 自动推断出返回类型是一个 number
    doubleCount(state) {
      return state.count * 2
    },
    // 返回类型**必须**明确设置
    doublePlusOne(): number {
      // 整个 store 的 自动补全和类型标注 ✨
      return this.doubleCount + 1
    },
  },
})

vue

<script setup>
import { useCounterStore } from './counterStore'
const store = useCounterStore()
</script>
<template>
  <p>Double count is {{ store.doubleCount }}</p>
  <p>User 2: {{ store.doubleCount(2) }}</p>
</template>

5. Action

import { mande } from 'mande'

const api = mande('/api/users')

export const useUsers = defineStore('users', {
  state: () => ({
    userData: null,
    // ...
  }),

  actions: {
    async registerUser(login, password) {
      try {
        this.userData = await api.post({ login, password })
        showTooltip(`Welcome back ${this.userData.name}!`)
      } catch (error) {
        showTooltip(error)
        // 让表单组件显示错误
        return error
      }
    },
  },
})

vue

<script setup>
const store = useCounterStore()
// 将 action 作为 store 的方法进行调用
store.randomizeCounter()
</script>
<template>
  <!-- 即使在模板中也可以 -->
  <button @click="store.randomizeCounter()">Randomize</button>
</template>

订阅action
可以通过store.$onAction来监听action和他们的结果,$action参数如下

  • name action名称
  • store store实例
  • args 传递给action的参数数组
  • after 在action返回或者解决后的狗子
  • onError 抛出错误的钩子
const unsubscribe = someStore.$onAction(
  ({
    name, // action 名称
    store, // store 实例,类似 `someStore`
    args, // 传递给 action 的参数数组
    after, // 在 action 返回或解决后的钩子
    onError, // action 抛出或拒绝的钩子
  }) => {
    // 为这个特定的 action 调用提供一个共享变量
    const startTime = Date.now()
    // 这将在执行 "store "的 action 之前触发。
    console.log(`Start "${name}" with params [${args.join(', ')}].`)

    // 这将在 action 成功并完全运行后触发。
    // 它等待着任何返回的 promise
    after((result) => {
      console.log(
        `Finished "${name}" after ${
          Date.now() - startTime
        }ms.\nResult: ${result}.`
      )
    })

    // 如果 action 抛出或返回一个拒绝的 promise,这将触发
    onError((error) => {
      console.warn(
        `Failed "${name}" after ${Date.now() - startTime}ms.\nError: ${error}.`
      )
    })
  }
)

// 手动删除监听器
unsubscribe()

默认情况下,action订阅器会绑定到使用他的组件上,如果组件被卸载 他会自动删除 如果想保留他们 可以穿第二个参数为true

<script setup>
const someStore = useSomeStore()
// 此订阅器即便在组件卸载之后仍会被保留
someStore.$onAction(callback, true)
</script>

4. vue3

reactive

使用注意:不能将一个对象或者数组直接赋值给由reactive创建的对象 这样会导致reactive创建的响应式对象被新赋值的直接代理,在vue3中操作的都是proxy代理对象,所以失去了响应式

解决办法

  1. 直接通过ref创建对象
  2. 通过对象[属性] 进行赋值

toRaw

toRow()方法可以返回由reactive()readonly()shallowReactive()或者shallowReadonly()创建的代理对象的原始对象

使用场景: 想改变ref/reactive的数据 但是又不想更新ui界面的情况下 可以使用toRaw()方法拿到他的原始数据,减少性能的消耗,此方法慎用

const foo = {}
const reactiveFoo = reactive(foo)

console.log(toRaw(reactiveFoo) === foo) // true

defineComponent

定义vue组件
参数:

  • name
  • props
  • setup
  • render
import { defineComponent } from 'vue'

export default defineComponent({
  // 启用了类型推导
  props: {
    message: String
  },
  setup(props) {
    props.message // 类型:string | undefined
  }
})

Vue 3结合element plus table数据更新而视图不更新解决方案

// 方案1:创建一个响应式对象,对象的属性是数组
const data = reactive({
    arr: []
});
data.arr = [1, 2, 3]

// 方案2: 使用ref函数
const data = ref([])
data.value = [1, 2, 3]

// 方案3: 使用数组的push方法
const arr = reactive([])
arr.push(...[1, 2, 3])

vue 双向绑定-编辑弹框修改数据后页面数据跟着更改,利用 Object.assign解决对象

const showFormDialog = async (params: UserDetail, index?: any) => {
  const obj = Object.assign({}, params);
  userDetail.value = obj;
};

vue3监听不到父组件传给子组件的props变化

// vue3props数据复制给data中的key时 监听不到他的变化 要监听props值的变化 然后再赋值给data
watch(
  () => props.addDialog,
  newValue => (addDialog.value = newValue)
);

defineprops

https://cn.vuejs.org/api/sfc-script-setup.html#defineprops-defineemits

withDefaults

作用是给defineProps绑定默认值的api

export interface Props {
  msg?: string
  labels?: string[]
}

const props = withDefaults(defineProps<Props>(), {
  msg: 'hello',
  labels: () => ['one', 'two']
})

vue3.sync修饰符移除 只用v-model:属性名代替

v-model:value="activePath"

defineEmits定义emit

const emit = defineEmits(["SelectionChange", "update:page", "update:pagesize"]);
emit("SelectionChange", val);

nextTick用法

import { ref, watch, reactive, nextTick } from "vue";
nextTick(() => {
    treeRef.value!.setCheckedKeys(props.checkedKey);
});

父组件调用子组件的方法

用到的知识点:defineExpose:

// 子组件
<script setup>
import { ref } from 'vue'

const a = 1
const b = ref(2)

defineExpose({
  a,
  b
})
</script>

// 父组件
<script>
//注册ref
const areaRef = ref(null);

// 调用子组件方法
areaRef.value.clearValue();

<CascaderProvince ref="areaRef" @changeData="changeData" />

</script>

在这里插入图片描述

slot的使用

  1. 默认插槽
  • buttonA组件
<template>
<slot></slot>
</template>
  • 使用组件
<buttonA>插入的内容</buttonA>
  1. 具名插槽
  • buttonA组件
<template>
<slot name="append"></slot>
</template>
  • 使用组件
<buttonA>
  	<template v-slot:append> 插入的内容</template>
 	<template #append> 具名插槽简写-插入的内容</template>
</buttonA>

5. ts

6. element-plus

7. vue-router

Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成,让用 Vue.js 构建单页应用变得轻而易举。功能包括:

useRouter(): Router

返回一个路由器实例 在模板中相当于$router 通过createRouter创建的路由信息可以通过这个方法获取

属性

  • currentRoute:当前页面路由信息
  • listening
    • 允许关闭历史事件的监听器。这是一个为微前端提供的底层 API
  • options:创建路由器时的原始选项对象。与createRouter参数中的options对应
    • end
    • history
    • linkActiveClass
    • parseQuery
    • routes: 应该添加到路由器的初始化路由列表
    • scrollBehavior
    • sensitive
    • strict:是否禁用尾部斜线
    • stringifyQuery

方法

  • addRoute
  • afterEach
  • back
  • beforeEach
  • beforeResolve
  • forward
  • getRoutes
  • go
  • hasRoute
  • isReady:返回一个promise 会在路由器初始化导航之后被解析,这在服务端渲染中确认服务端和客户端输出一致的时候非常有用
  • onError: 捕获路由导航错误
  • push
  • removeRoute
  • replace
  • resolve

用到的插件

@pureadmin/descriptions、PureDescriptions、PureDescriptions

都是基于element-plus二次封装的组件

@vueuse/core

veuse是一个基于Composition API的实用函数集合

@vueuse/motion

可组合组件使组件处于运动状态 可以在nuxt中使用

  • 全局安装
import { MotionPlugin } from '@vueuse/motion'

const app = createApp(App)

app.use(MotionPlugin)

app.mount('#app')
  • 有些设定好的指令 链接
  • 属性
    initial:元素在被挂载之前将具备的属性。
    enter:元素在挂载后将装备的属性。
    visible:元素每次出现在视图中时都会装备的属性。一旦它离开了视图,初始属性将被应用。
    visible-once:元素出现在视图中时就会显示的属性。
    hovered:当指针进入该元素的区域时,该元素将拥有的属性。
    focused:当该元素被聚焦时,该元素将装备的属性。
    tapped: 点击(鼠标)或点击(t)时元素将装备的属性
    varians:设置要
  • example
<template>
  <div
    v-motion
    :initial="{ opacity: 0, y: 100 }"
    :enter="{ opacity: 1, y: 0,
     scale: 1 }"
    :hovered="{ scale: 1.2 }"
    :delay="200"
  />
</template>

animate.css 动画样式库
dayjs 类似于moment 格式化时间
element-resize-detector 监听元素宽度变化
mitt

一个200字节的小型函数时事件发射器/发布订阅器,用于实现模块之间的通信、ui交互等等

NProgress 浏览器顶部的进度条
responsive-storage

响应式本地存储
完全兼容vue2和vue3

知识点总结

import.meta.glob
vite支持使用特殊的import.meta.glob函数从文件系统导入多个模块 为异步加载模块

const modules = import.meta.glob(
	["./modules/**/*.ts", "!./modules/**/remaining.ts"] // 该文件下除了remaining.ts的所有ts文件
	{ eager: true } // 这个参数可以同步引入所有的模块,如果没有的话 匹配的文件默认是懒加载的
)

获取MAC地址

/**获取mac地址信息 */
import { networkInterfaces } from "os";
export const getMacAddress = function (): string {
  const interfaces = networkInterfaces();
  let macAddress = "";
  for (const interfaceName of Object.keys(interfaces)) {
    const interfaceInfos = interfaces[interfaceName];

    if (interfaceInfos) {
      for (const interfaceInfo of interfaceInfos) {
        if (interfaceInfo.mac && interfaceInfo.mac !== "00:00:00:00:00:00") {
          macAddress = interfaceInfo.mac;
          break;
        }
      }
    }

    if (macAddress.length > 0) break;
  }

  return macAddress;
};

js 计算浮点数精度问题

  1. 使用toFixed
parseFloat((数学表达式).toFixed(digits))// toFixed() 精度参数须在 0 与20 之间
  1. Math.js
  2. decimal.js
  3. big.js

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

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

相关文章

A10的pll reconfig

一、前言 我之前写过《quartus动态配置pll reconfig》&#xff0c;讲的是A5的pll reconfig。 这次调A10&#xff0c;结果发现寄存器配置、地址、操作流程都变了&#xff0c;不能无脑移植。 二、寄存器配置 1&#xff0c;A5的寄存器配置如下&#xff1a; 其中基地址如下&…

皮卡丘靶场搭建遇到的问题大全

该博客记录我在安装皮卡丘靶场中遇到的一些问题。 1、 phpstudy_pro启动Mysql失败 自己电脑开启了mysql服务&#xff0c;使用winr&#xff0c;services.msc&#xff0c;找到自己的mysql服务&#xff0c;关闭。再次尝试使用phpstudy_pro启动mysql&#xff0c;成功解决。 2、皮…

基于Matlab实现生活中的图像信号分类(附上源码+数据集)

在我们的日常生活中&#xff0c;我们经常会遇到各种各样的图像信号&#xff0c;例如照片、视频、图标等等。对这些图像信号进行分类和识别对于我们来说是非常有用的。在本文中&#xff0c;我将介绍如何使用Matlab来实现生活中的图像信号分类。 文章目录 介绍源码数据集下载 介…

ElasticSearch学习5-- 使用RestClient查询文档

1、查询基本步骤 1、创建SearchRequest对象 2、准备Request.source()&#xff0c;也就是DSL。 QueryBuilders来构建查询条件 传入Request.source() 的 query() 方法 3、发送请求&#xff0c;得到结果 4、解析结果&#xff08;参考JSON结果&#xff0c;从外到内…

美团 Flink 资源调度优化实践

摘要&#xff1a;本文整理自美团数据平台计算引擎组工程师冯斐&#xff0c;在 Flink Forward Asia 2022 生产实践专场的分享。本篇内容主要分为四个部分&#xff1a; 相关背景和问题解决思路分析资源调度优化实践后续规划 点击查看原文视频 & 演讲PPT 一、相关背景和问题 在…

OpenSSL 远程代码执行漏洞 CVE-2022-1292 升级方案及步骤

升级方案 升级步骤 1.查看版本号 命令:openssl version 2.下载安全版本openssl: openssl官网 下载 openssl-1.1.1o.tar.gz 3.编译安装 在/usr/lib/下创建目录openssl 输入命令: mkdir openssl 将下载的包openssl-1.1.1o.tar.gz放到这个目录,并解压 输入命令: tar -xv…

SAP 之IMG/SPRO解释

一、IMG是什么 二、使用步骤 1.举例 总结 一、IMG是什么 IMG-IMplementation Guide&#xff0c;是实施指引的简称&#xff0c;事务代码是 SPRO-SAP Project Reference Object。IMG是SAP中用于定制系统以满足业务要求的工具&#xff0c; 二、使用步骤 1.举例 例如&#xff0c…

保姆级教程之SABO-VMD-SVM的西储大学轴承诊断

之前写过一篇优化核极限学习机的轴承诊断&#xff0c;今天再出一期基于SVM的轴承诊断。 依旧是包含了从数据处理&#xff0c;到减法优化器SABO算法优化VMD参数&#xff0c;再到支持向量机的故障诊断&#xff0c;实现故障诊断的全流程&#xff0c;其他类型的故障诊断均可参考此流…

GrapeCity Documents V6.0 Update 2发布,新增支持SpreadJS的.sjs文件格式

近日&#xff0c;GrapeCity Documents 正式迎来其V6.2 的发布更新&#xff0c;能够支持 SpreadJS 中 .sjs 类型的文件。这一重大更新将为用户带来更多地惊喜。 .sjs文件有两个关键优势&#xff1a;空间更小且导入导出速度更快。通过采用 .sjs格式&#xff0c;GcExcel实现了更高…

云计算环境中高性能计算的挑战与对策

文章目录 云计算中的高性能计算挑战1. 资源竞争&#xff1a;2. 网络延迟&#xff1a;3. 数据传输效率&#xff1a;4. 虚拟化开销&#xff1a;5. 节点异构性&#xff1a; 高性能计算在云计算环境中的对策1. 定制化虚拟机镜像&#xff1a;2. 弹性资源调整&#xff1a;3. 高效数据…

【Sql】把数据库字段用函数根据逗号分裂成列表,然后判断列表中是否包含目标值

【Sql】把数据库字段用函数根据逗号分裂成列表&#xff0c;然后判断列表中是否包含目标值 【1】问题描述【2】Oracle内置函数解决【3】mysql的内置函数INSTR()【4】mysql的内置函数FIND_IN_SET() 【1】问题描述 数据库中【库信息db】和【集群信息cluster】是一对多的关系&…

学弟学妹们!要开学了,这些好物一定要提前备

开学的脚步近了&#xff0c;近了&#xff0c;神兽归笼&#xff0c;万物更新&#xff0c;大家迎接开学季的阵仗堪比迎接春天了。灵魂发问&#xff1a;开学装备备齐了吗&#xff1f;神兽们的情绪调整好了吗&#xff1f;自己要不要再回回炉&#xff0c;充充电&#xff1f;这次整理…

javacv 基础04-读取mp4,avi等视频文件并截图保存图片到本地

javacv 读取mp4,avi等视频文件并截图保存图片到本地 代码如下&#xff1a; package com.example.javacvstudy;import org.bytedeco.javacv.FFmpegFrameGrabber; import org.bytedeco.javacv.Frame; import org.bytedeco.javacv.Java2DFrameConverter;import javax.imageio.Im…

《算法竞赛·快冲300题》每日一题:“浇水”

《算法竞赛快冲300题》将于2024年出版&#xff0c;是《算法竞赛》的辅助练习册。 所有题目放在自建的OJ New Online Judge。 用C/C、Java、Python三种语言给出代码&#xff0c;以中低档题为主&#xff0c;适合入门、进阶。 文章目录 题目描述题解C代码Java代码Python代码 “ 浇…

得帆信息东区总经理周俊君:该采用低代码和无代码给繁重的SAP减减负了

数字化转型对任何有竞争力的业务都至关重要&#xff0c;组织踏上数字化转型之旅&#xff0c;意味着要么重新开始&#xff0c;要么在现有IT建设的基础上再接再厉。这段旅程不仅仅是采用新技术&#xff0c;而是寻求在高可用性的同时为客户提供差异化价值。为了帮助客户达成这些目…

报表技术POI和EasyPOI处理百万数据、CSV、Word

1、了解百万数据的导入 1.1 需求分析 使用POI基于事件模式解析案例提供的Excel文件 1.2 思路分析 用户模式&#xff1a; 加载并读取Excel时&#xff0c;是通过一次性的将所有数据加载到内存中再去解析每个单元格内容。当Excel数据量较大时&#xff0c;由于不同的运行环境可…

欧盟GMP附录-对气流流型的11条要求及解读

欧盟GMP附录《无菌药品生产》已经生效&#xff0c;本文总结了该附录对气流流型的11条要求&#xff0c;并进行延伸解读。 【气流流型检测仪】 具体11条如下&#xff0c;来自EU GMP 无菌附录。 1.洁净室和区域内的气流模式应可视化&#xff0c;以证明气流不会从低洁净级别区域进…

【数据结构】带头双向循环链表及其实现

目录 1.带头双向循环链表 2.带头双向循环链表实现 2.1初始化 2.2销毁 2.3头插 2.4链表打印 2.5头删数据 2.6尾插数据 2.7尾删数据 2.8链表判空 2.9查找一个数据 2.10在pos位置前插入数据 2.11删除pos位置 2.12求链表的长度 2.顺序表和链表的比较 1.带头双向循环…

字节前端实习的两道算法题,看看强度如何

最长严格递增子序列 题目描述 给你一个整数数组nums&#xff0c;找到其中最长严格递增子序列的长度。 子序列是由数组派生而来的序列&#xff0c;删除&#xff08;或不删除&#xff09;数组中的元素而不改变其余元素的顺序。例如&#xff0c;[3,6,2,7] 是数组 [0,3,1,6,2,2,7…

使用DataX对MySQL 8.1进行数据迁移

1. 环境准备 1.1 下载DataX 这里采用直接下载的方式&#xff1a;https://datax-opensource.oss-cn-hangzhou.aliyuncs.com/202308/datax.tar.gz&#xff0c;不过这个包是真的有点大。 1.2 安装Python Python下载地址&#xff1a;https://www.python.org/downloads/ 安装的时…