叹之的博客_(5)_51CTO博客
51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
WOT技术大会
IT证书
公众号矩阵
移动端
短视频 免费课程 课程排行 直播课 软考学堂
全部课程 厂商认证 IT技术 25年5月软考 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库

Vue引入本地文件无效

无效的原因是，在webpack打包的设置(/config/index.js)中，指定将静态资源打包到static文件夹下，从而导致路径错误。解决方法：将静态资源放在static文件夹下再引入– 打包之前– 打包之后或者在引入时默认静态资源在static文件夹下我在根目录下建立了css文件夹用来装样式文件但是在引入的时候，我认为他已经在static文件夹下了（因为运行时它会被安排在那里）你看，它还在提示，找不到bootstrap.css，因为它现在确实不在static下，但是当运行

前端
css
vue
html
css3
原创 2021-07-09 10:44:10 1996 阅读

Vue中使用less出错：loaderContext.getResolve is not a function

错误原因less-loader版本过高正确的使用方式下载// 严格控制版本号npm install less@3.12.2 less-loader@4.1.0 --save-dev// 下面两个vue-cli会自动帮我们下载，不需要再安装// 但如果你重新安装过，要注意版本号不能太高// npm install css-loader@0.28.0 vue-style-loader@3.0.1 --save-dev引入// 在main.js中import less from

前端
vue
css
vue.js
前端 css vue
原创 2021-07-09 10:44:08 190 阅读

Vue-cli的基本使用及版本差异

说明vue cli(command line interface) 是vue的脚手架，用于快速搭建一个项目的模版，通俗来讲就是创建一个空项目，并且做好相关的配置，最主要是webpack的配置，node的配置安装// 目前安装的版本是 4.5.9cnpm install @vue/cli -g以上安装的vue cli版本较高，如果需要按照vue cli2的方式初始化项目，可以全局安装一个桥接工具// 版本 2.9.6cnpm install @vue/cli-init -g 初始化项目如

前端
vue.js
前端 css vue
原创 2021-07-09 10:44:07 2061 阅读

前端路由与后端路由的区别及SPA的前端路由(主要记录Vue-router)

后端路由在没有出现ajax技术，前后端还没有分离的时候，往往我们通过浏览器访问一个网址时，后端会返回对应网址的完整页面(html+css+js)，也就是我们看到的页面，在后端就已经长这样了。那么当一个网站的页面多达几十上百个的时候，对这些网址(路径)的请求，就需要组织管理起来，对指定的请求路径返回指定的网页，这就是后端路由前端路由而出现ajax技术以后，前后端迅速的分离，后端主要负责提供接口，前端主要负责页面渲染。我们看到的页面是在前端生成的。主要流程是这样，由前端通过ajax请求接口，后端返回对应的

前端
javascript
vue.js
前端 css vue
原创 2021-07-09 10:44:05 532 阅读

Vue2.x到Vue3.x的变化

template替换差异在Vue2.x中，会将template中全部内容覆盖到要替换的位置，也就是原标签会消失<!-- App.vue --><template> <div id="appx"> test </div></template><!-- index.html --><div id="app"></div>// main.jsnew Vue({ render:

前端
vue.js
javascript
html
前端 css vue
原创 2021-07-09 10:44:03 161 阅读

vuex使用教程详细笔记

简介vuex是专门用来管理vue.js应用程序中状态的一个插件。他的作用是将应用中的所有状态都放在一起，集中式来管理。需要声明的是，这里所说的状态指的是vue组件中data里面的属性。vuex组成结构示意图vuex的特点是把数据单独隔离，形成一棵树状图。单独隔离就意味着它有自己的生态系统。

前端
vue.js
原创 2021-07-09 10:43:33 3034 阅读

Vue 组件的生命周期

单个组件的生命周期beforeCreate组件创建之前执行，此时还没有data和methodsexport default { name: 'App', data() { return { count: 0 } }, beforeCreate() { console.log(this.count) this.test() }, methods: { test() { console.log(1234)

前端
vue
html
javascript
Vue
原创 2021-07-09 10:43:01 186 阅读

Vuex 学习总结 —— 完整案例

目录结构components/src/components/TodoFooter.vue<template> <div> <label> <input type="checkbox" v-model="checkAll"/> </label> <span> <span>已完成{{completeSize}}</span> / 全部{{tota

Vue
vue
原创 2021-07-09 10:43:00 71 阅读

Vue 源码学习 —— Mustache 模板引擎原理

前言Mustache 是模板引擎思想的奠基者，Vue 中的模板引擎也借用了它的思想因此，在学习Vue的模板引擎之前，先学习Mustache能加更容易理解模板引擎的设计思想Mustache下载：到 BootCDN 搜索 mustache，复制链接到浏览器打开，并保存到本地即可或使用该链接：mustache.js(v4.1.0)引入：基本使用：渲染普通对象： <div id="root"></div> <script src="js/mustache

Vue 源码
vue
Vue
原创 2021-07-09 10:42:58 813 阅读

Vue 源码学习 —— snabbdom 虚拟 DOM 和 diff 算法原理

前言snabbdom 是著名的虚拟DOM库，是 diff 算法的奠基者，Vue也借用了它的思想因此，在学习Vue的虚拟DOM和diff算法之前，先学习snabbdom能加更容易理解其设计思想snabbdom安装snabbdomnpm i -S snabbdomwebpack环境配置webpack安装npm i -D webpack@5 webpack-cli@3 webpack-dev-server@3目录：webpack.config.jsmodule.

Vue 源码
vue
Vue
原创 2021-07-09 10:42:57 189 阅读

Vue 源码学习 —— 数据响应式原理 (Vue 2.x)

对象的响应式目录结构：执行关系：observe.jsimport Observer from './Observer'export default function observe (value) { // 如果 value 不是对象，则不处理 if (typeof value != 'object' || !value) return var ob if (value.__ob__) { ob = value.__ob__

Vue 源码
vue
Vue
原创 2021-07-09 10:42:55 209 阅读

Vue 源码学习 —— AST 抽象语法树形成

AST 理解AST 跟 虚拟DOM 的关系手写简单源码目录结构：parse.js:// 处理原始串，去除换行跟空格function trimAll (str) { let strList = str.split('\n') strList = strList.map(s=>s.trim()) return strList.join('')}// 解析属性字符串function parseAttrs (attrsStr) { attrsStr

Vue 源码
js
vue.js
Vue
原创 2021-07-09 10:42:54 530 阅读

Vue3 学习笔记 —— setup

setup新的 option，只在初始化时执行一次如果该函数返回对象，对象中的属性或方法，在模板中可以直接使用<template> {{msg}} // 此处使用</template><script lang="ts">import { defineComponent } from 'vue';export default defineComponent({ name: 'App', setup () { return {msg:

Vue3
vue
Vue
原创 2021-07-09 10:42:52 127 阅读

Vue3 学习笔记 —— ref 和 reactive

ref一般用来定义基础类型的响应式数据返回一个对象，通过.value访问定义的基础类型值在template中，不需要使用 .value<template> {{count}} // 在template中使用时，不需要 .value <button @click="addCount">加1</button></template><script lang="ts">import { defineComponent, ref

Vue3
vue
Vue
原创 2021-07-09 10:42:51 306 阅读

Vue3 学习笔记 —— computed 和 watch

<template> <div> firstName: <input type="text" v-model="user.firstName"> lastName: <input type="text" v-model="user.lastName"> </div> <div> fullName1: <input type="text" v-model="fullName1"> f

Vue3
vue
Vue
原创 2021-07-09 10:42:50 350 阅读

Vue3 学习笔记 —— 生命周期

目录结构如下：App.vue<template> <Child :count="count" v-if="isShow" @addCount="addCount"/> <button @click="isShow=!isShow">切换显示</button></template><script lang="ts">import { defineComponent, ref} from 'vue';impor.

Vue3
vue
Vue
原创 2021-07-09 10:42:48 356 阅读

Vue3 学习笔记 —— 自定义 hook

目录结构Child.vue<template>x: {{x}}y: {{y}}</template><script lang="ts">import { defineComponent} from 'vue';import useMousePosition from '../hooks/useMousePosition'export default defineComponent({ name: 'Child', setup() {.

Vue3
vue.js
Vue
原创 2021-07-09 10:42:47 198 阅读

Vue3 学习笔记 —— toRefs

toRefs作用：将一个响应式对象，转换为普通对象，并且将其中的属性转换为 Ref 对象 setup() { let state = reactive({ name: 'zly', age: 47 }) let state2 = toRefs(state) console.log(state) // 响应式对象 console.log(state2) // 普通对象，其中的属性被转换为 Ref 属性 return

Vue3
vue
Vue
原创 2021-07-09 10:42:46 384 阅读

Vue3 学习笔记 —— shallowReactive 和 shallowRef

shallowReactive只处理了对象内最外层属性的响应式，适用于对象结构较深，但只有外层属性变化shallowRef只处理了value的响应式，不进行对象的 reactive 处理，适用于会被替换的数据示例：<template> m1: {{m1}} <br> m2: {{m2}} <br> m3: {{m3}} <br> m4: {{m4}} <br> <button @click="change

Vue3
vue
Vue
原创 2021-07-09 10:42:44 516 阅读

Vue3 学习笔记 —— readonly 和 shallowReadonly

readonly使用 readonly 函数包装过的对象，内部是深层次只读的shallowReadonly使用 shallowReadonly 函数包装过的对象，只有最外层属性是只读的，内层仍然可以改写示例：<template> <button @click="change">改变</button></template><script lang="ts">import { defineComponent, reado

Vue3
vue
Vue
原创 2021-07-09 10:42:43 252 阅读

Vue3 学习笔记 —— toRaw 和 markRaw

toRaw返回响应式对象的普通对象，可以通过这个对象达到修改属性，而不更新页面的效果markRaw标记一个普通对象，使得它不可以被转换成响应式对象

Vue3
vue
Vue
原创 2021-07-09 10:42:42 378 阅读

Vue3 学习笔记 —— toRef 跟 ref 的区别

toRef返回一个对象属性的Ref对象，该Ref对象的value 跟原对象属性的值相耦合ref将一个数据包装成Ref对象，该Ref对象的value与原数据没有关联示例：<template> <button @click="change">改变</button></template><script lang="ts">import { defineComponent, ref, reactive, toRef} fro

Vue3
vue
Vue
原创 2021-07-09 10:42:40 185 阅读

Vue3 学习笔记 —— customRef

customRef自定义ref，可以控制数据的追踪跟触发更新测试代码：<template> <input type="text" v-model="state"> state: {{state}}</template><script lang="ts">import { defineComponent, customRef} from 'vue';function useDebounceRef (value:string, de

Vue3
vue.js
Vue
原创 2021-07-09 10:42:39 241 阅读

Vue3 学习笔记 —— 响应式数据的判断

isRef判断一个值是否为一个 ref 对象isReactive判断一个对象是否是由 reactive创建的响应式代理isReadonly判断一个对象是否是由 readonly 创建的只读代理isProxy判断一个对象是否是由 reactive 或 readonly 创建的代理测试代码：<template> <div></div></template><script lang="ts">impo

Vue3
vue
Vue
原创 2021-07-09 10:42:38 178 阅读

Vue3 学习笔记 —— 异步组件

App.vue<template> <!-- 当异步组件还未展示时用于显示备选组件 --> <Suspense> <!-- 默认显示 --> <template #default> <AsyncComponent/> </template> <!-- 加载时显示 v-slot: 可以简写为 # --> <template v-slot:.

Vue3
vue
Vue
原创 2021-07-09 10:42:36 207 阅读

super super mini-vue

Evan You 【中英字幕】- Vue3 Mastery<div id="app"></div><script> function h(tag, props, children) { return { tag, props, children }; } function mount(vnode, container) { const { tag, props, children } = vn.

Vue3
vue.js
Vue
原创 2021-07-09 10:42:35 136 阅读

大型数据库技术复习 —— T-SQL编程

简介T-SQL 即 Transact-SQLTransact-SQL是SQL-Server特有的在SQL基础上扩展后的超集。标识符常规标识符跟其他语言的变量命名完全一致特殊标签符：@：表示局部变量@@：表示全局变量#：表示局部临时对象##：表示全局临时对象对象简写例： server.database.owner.object简写格式– server.database…object– server…owner.object– server…object– data

数据库
sql
原创 2021-07-09 10:41:18 82 阅读

大型数据库技术复习 —— 事务控制

### 简介- 事务是一个用户定义的完整的工作单元，一个事务内的所有语句被作为整体执行，要么全部执行，要么全部不执行。遇到错误时，可以回滚事务，取消事务内所做的所有改变，从而保证数据库中数据的一致性和可恢复性。

数据库
sql
原创 2021-07-09 10:41:16 93 阅读

大型数据库技术复习 —— 数据库和表存储结构

## 数据库结构<hr>### 数据库文件和文件组- 主数据库文件（`Primary Database File`）：是数据库的起点，可以指向数据库中文件的其它部分。每个数据库都有一个主数据库文件。文件扩展名一般是 `.mdf`。- 次数据库文件（`Secondary Database File`）：有些数据库可能没有次数据文件，扩展名是 `.ndf`。 - 事务日志文件：日志文件包含恢复数据库所需的所有日志信息。每个数据库必须至少有一个日志文件，但可以不止一个。推荐的文件扩展名是 `.ld

数据库
sql
原创 2021-07-09 10:41:15 230 阅读

大型数据库技术复习 —— 索引

### 简介- 数据库中的索引是某个表中一列或者若干列**值的集合** 和 指向表中物理标识这些值的**数据页的逻辑指针**清单。

数据库
sql
原创 2021-07-09 10:41:14 151 阅读

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯