VS关闭安全检查的代码
#define _CRT_SECURE_NO_WARNINGS 1
VS Code 中运行Java SpringBoot的项目
一、前提条件 JDK、Maven已配置好 二、安装插件 Language Support for Java(TM) by Red Hat Debugger for Java Spring Boot Extension Spring Boot Dashboard 3. 创建或导入Spring Boot项目 使用Spring Initializr创建新项目 打开命令面板(按 Ctrl+Shift+P 或 Cmd+Shift+P)。 输入 Spring Initializr: Generate a Maven Project 并选择该选项。 按照提示选择项目的配置,例如 Group、Artifact、Dependencies 等。 选择项目生成位置并点击“生成”。 VSCode会提示你打开生成的项目。 导入现有项目 直接将项目文件夹拖到VSCode窗口中。 VSCode会自动检测并建议你安装所需的扩展(如果还没有安装的话)。 4. 配置VSCode 配置调试环境 打开调试视图(点击侧栏上的虫子图标或按 Ctrl+Shift+D)。 点击 create a launch.jso...
设置VsCode编码
① 按 Ctrl+Shift+P 搜索所有命令 ② 输入settings ,打开用户设置
VsCode插件收录
Vue 3 Snippets Vue - Official vue Spring Initializr Java Support Spring Boot Tools Spring Boot Extension Pack Spring Boot Dashboard Python Pylance One Dark Pro Material lcon Theme Live Preview tongyi Language Support for Java™ by Red Hat HTML CSS Support GitHub Copilot Chat GitHub Copilot Error Lens Debugger for Java Code Spell Checker CMake Tools CMake Chinese (Simplified) .NET Install Tool Auto Rename Tag Better C++ Syntax Better Comments C/C++ C/C++ Extension Pack C/C++ Themes C# C# Dev K...
Vue2代码运行步骤
浏览器加载 index.html。 加载并执行 main.js。 初始化 Vue 实例并挂载到 DOM。 解析根组件 App.vue。 加载路由和状态管理(如果有)。 执行组件的生命周期钩子。 渲染子组件。 响应式数据更新,动态更新页面。 当 Vue 实例启动后,组件会经历以下生命周期钩子: beforeCreate:实例初始化之前。 created:实例创建完成,数据和事件已初始化,但未挂载 DOM。 beforeMount:模板编译完成,但尚未挂载到 DOM。 mounted:组件挂载到 DOM,页面渲染完成。 updated:响应式数据更新后,重新渲染。(Vue 会自动更新 DOM) destroyed:组件销毁时执行清理操作。
Vue2组件基本结构
<template> <div> //code... </div> </template> <script> export default { data() { return {} }, computed: {}, watch: {}, created() { }, mounted() { }, beforeDestroy() { console.log('我要走了') // 清理定时器 // clearInterval(this.timer) } methods: {} } </script> <style scoped> </style>
VSCode设置配置文件
{ // 调试时即使任务出错也继续调试 "debug.onTaskErrors": "debugAnyway", // 差异编辑器中开启自动换行 "diffEditor.wordWrap": "on", // 光标平滑闪烁 "editor.cursorBlinking": "smooth", // 编辑器字体大小(支持小数) "editor.fontSize": 13.5, // 显示括号对引导线 "editor.guides.bracketPairs": true, // 按住 Ctrl 并滚动鼠标滚轮可缩放字体 "editor.mouseWheelZoom": true, // 启用编辑器平滑滚动 "editor.smoothScrolling": true, // 代码补全默认选中第一个建议项 "editor.suggestSelection": "first", // 编辑器自动换行 "editor.wordWrap":...
Vue3代码运行步骤
浏览器加载 index.html。 加载并执行 main.js。 使用 createApp()创建 Vue 应用实例。 注册路由和状态管理(如果有)。 挂载 Vue 应用到 DOM(如 #app)。 解析根组件 App.vue。 执行组件的生命周期钩子。 渲染子组件。 响应式数据更新,动态更新页面。 当 Vue 实例启动后,组件会经历以下生命周期钩子: onBeforeCreate:实例初始化之前。 onCreated:实例创建完成,数据和事件已初始化,但未挂载 DOM。 onBeforeMount:模板编译完成,但尚未挂载到 DOM。 onMounted:组件挂载到 DOM,页面渲染完成。 onUpdated:响应式数据更新后,重新渲染。(Vue 会自动更新 DOM) onDestroyed:组件销毁时执行清理操作。
Vue2项目快速集成ElementUI
1、下载依赖 npm i element-ui -S 2、导入依赖 在main.js文件下添加如下代码即可 import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI,{size:"small"}); 3、测试 在任一vue文件中添加如下所示代码 <el-button>这是一个测试按钮</el-button> 效果如下所示
nextTick的理解
其实就是在DOM内容完全更新了之后再执行callback中的操作,避免拿到脏DOM 常用于需要操作更新后 DOM 的场景,比如获取元素尺寸、聚焦输入框、初始化第三方库等。 export default { data() { return { message: 'Hello' } }, methods: { updateMessage() { this.message = 'Updated!'; // 修改数据 // ❌ 此时 DOM 还未更新 console.log(this.$el.textContent); // 可能还是 'Hello' // ✅ 等 DOM 更新后再执行 this.$nextTick(() => { console.log(this.$el.textContent); // 现在是 'Updated!' }); } ...
