website·Indexed 31 days ago
https://docs.plumliil.cn/A collection of technical notes and guides covering frontend and backend technologies, including JavaScript, TypeScript, Vue (Vue-Router, Vuex), React, and MySQL. It also includes documentation for simplify-deploy, a Node.js-based SSH deployment tool.
The VuePress theme-hope layout consists of global elements and page-specific components that can be customized via theme options and page frontmatter.
Global Layout Elements:
Page-Specific Elements:
Interface Elements:
markdown-it. Theme Hope extends this functionality through two primary layers: standard VuePress enhancements and additional theme-specific enhancements provided by the vuepress-plugin-md-enhance plugin. These extensions allow for richer content including interactive components, charts, and advanced layout options.MySQL is a free, open-source Relational Database Management System (RDBMS) designed for performance, stability, and scalability. Key architectural concepts include:
A Promise is a solution for asynchronous programming in JavaScript. Syntactically, it is an object that allows you to retrieve the result of an asynchronous operation. Once a Promise is created, it executes immediately. A Promise exists in one of three mutually exclusive states:
pending: The initial state, awaiting completion.fulfilled: The operation completed successfully.rejected: The operation failed.Crucially, once a Promise transitions from pending to either fulfilled or rejected, its state becomes immutable and cannot be changed again.
SHOW and DESC commands to retrieve metadata about your databases and table structures.-- Database inspection
SHOW DATABASES; -- List all databases
SELECT DATABASE(); -- Current connected database
SHOW CREATE DATABASE db_name; -- Show creation script for a specific DB
-- Table inspection
DESC grade; -- Show table structure/columns
SHOW CREATE TABLE grade; -- Show creation script for a specific tableuseCallback to memoize a function definition. This prevents the function from being recreated on every render unless its dependencies change. This is particularly useful when passing functions to child components wrapped in React.memo, as it prevents unnecessary re-renders of those children.const render = React.useCallback(() => {
let list = [];
for (let i = 0; i < range.max; i++) {
list.push(<li key={i}>{i}</li>);
}
return list;
}, [range]); // Only recreates if range changesJavaScript provides three ways to declare variables, with a recommended priority of const > let > var.
var: Function-scoped. Variables are hoisted to the top of the function scope. If declared without a keyword inside a function, it becomes a global variable.let: Block-scoped. Does not support hoisting (exists in a 'Temporal Dead Zone' until declaration). Cannot be redeclared in the same scope.const: Block-scoped. Used for constants that cannot be reassigned. Note: While the reference is constant, properties of objects or elements of arrays declared with const can still be modified.// var hoisting
function fn() {
console.log(age); // undefined
var age = 18;
}
// let block scope
if(true) {
let message = 'hello';
}
console.log(message); // ReferenceError
// const usage
const web = 'lyh.com';
// web = 'new.com'; // TypeErroruseStore hook to access the Vuex store instance within the <script setup> block. You can then access the state directly or commit mutations using store.commit().<template>
<div>
<h1>{{ store.state.num }}</h1>
<button @click="add">+1</button>
<button>-1</button>
</div>
</template>
<script setup>
import { useStore } from "vuex";
const store = useStore();
const add = () => {
store.commit("add");
console.log(store.state.num);
};
</script>setup() function is the entry point for the Composition API. It executes once during component initialization. Data and methods returned from setup are directly available in the template. Note that this is not available inside setup. Avoid making setup an async function unless you are using the Suspense component, as an async setup turns the component into an asynchronous component.