当前位置：首页 > news >正文

Web前端-Vue2+Vue3基础入门到实战项目-Day1(初始Vue, Vue指令, 小黑记事本)

news 文章来源：https://blog.csdn.net/Y_cen/article/details/133445288 2025/1/11 21:53:01

Web前端-Vue2+Vue3基础入门到实战项目-Day1

Vue快速上手
- 创建一个Vue实例
- 插值表达式
- Vue响应式特性
Vue指令
- 指令初识和 v-html
- v-show 和 v-if
- v-else 和 v-else-if
- v-on
- - 内联语句
  - methods处理函数
  - 调用传参
- v-bind
- 案例 - 波仔的学习之旅
- v-for
- - v-for基本使用
  - 案例 - 小黑的书架
  - v-for的key
- v-model
综合案例 - 小黑记事本
来源

Vue快速上手

创建一个Vue实例

创建Vue实例, 初始化渲染的核心步骤:

准备容器
引包(官网) - 开发版本 / 生产版本
创建Vue实例 new Vue()
指定配置项 el data => 渲染数据
- el: 指定挂载点, 选择器指定控制的是哪个盒子
- data: 提供数据

<body>
<div id="app"><h1>{{ msg }}</h1><a href="#">{{ count }}</a>
</div><!-- 引入开发版本包 - 包含完整的注释和警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>// 引入VueJS核心包, 就有了Vue构造函数const app = new Vue({// 通过 el 配置选择器, 指定 Vue 管理的是哪个盒子el: '#app',// data 提供数据data: {msg: "Hello Vue",count: 666}})
</script></body>

插值表达式

作用: 利用表达式进行插值, 将数据渲染页面中
格式: {{ 表达式 }}
注意点:
- 使用的数据要存在(data)
- 支持的是表达式, 而非语句 if ... for
- 不能在标签属性里使用

<body>
<div id="app"><p>{{ nickname }}</p><p>{{ nickname.toUpperCase() }}</p><p>{{ nickname+'你好' }}</p><p>{{ age>= 18 ? '成年' : '未成年' }}</p><p>{{ friend.name }}</p><p>{{ friend.desc }}</p>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>
<script>const app = new Vue({el: '#app',data: {nickname: 'tony',age: 18,friend: {name: 'jepson',desc: '热爱学习 Vue'}}})
</script>
</body>

Vue响应式特性

响应式: 数据变化, 视图自动更新
访问和修改数据
- data中的数据, 会被添加到实例上
- 访问数据: 实例.属性名
- 修改数据: 实例.属性名 = 值

<body>
<div id="app">{{ msg }}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>
<script>const app = new Vue({el: '#app',data: {msg: 'Hello Vue'}})
</script>
</body>

Vue指令

指令初识和 v-html

Vue指令: 带有v-前缀的特殊标签属性

<body><div id="app"><div v-html="msg"></div></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {msg: `<a href="http://www.itheima.com">黑马程序员</a>`}})</script>
</body>

v-show 和 v-if

v-show
- 底层原理:切换 css 的 display: none 来控制显示隐藏
- 场景: 频繁切换显示隐藏的场景
v-if
- 底层原理: 根据判断条件控制元素的创建和移除(条件渲染)
- 场景: 要么显示, 要么隐藏, 不频繁切换的场景

<head>...<style>.box {width: 200px;height: 100px;line-height: 100px;margin: 10px;border: 3px solid #000;text-align: center;border-radius: 5px;box-shadow: 2px 2px 2px #ccc;}</style>
</head>
<body><div id="app"><div v-show="flag" class="box">我是v-show控制的盒子</div><div v-if="flag" class="box">我是v-if控制的盒子</div></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {flag: true}})</script>
</body>

v-else 和 v-else-if

<body><div id="app"><p v-if="gender === 1">性别：♂ 男</p><p v-else>性别：♀ 女</p><hr><p v-if="score >= 90">成绩评定A: 奖励电脑一台</p><p v-else-if="score >= 70">成绩评定B: 奖励周末郊游</p><p v-else-if="score >= 60">成绩评定C: 奖励零食礼包</p><p v-else>成绩评定D: 惩罚一周不能玩手机</p></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {gender: 1,score: 80}})</script>
</body>

v-on

内联语句

<body><div id="app"><!-- <button v-on:click="--count">-</button> --><!-- 鼠标进入 --><!-- <button v-on:mouseenter="--count">-</button> --><!-- 简化写法 --><button @click="--count">-</button><span>{{ count }}</span><button v-on:click="++count">+</button></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {count: 100}})</script>
</body>

methods处理函数

<body><div id="app"><button @click="fn">切换显示隐藏</button><h1 v-show="isShow">黑马程序员</h1></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {isShow: false},methods: {fn () {this.isShow = !this.isShow}}})</script>
</body>

调用传参

<head>...<style>.box {border: 3px solid #000000;border-radius: 10px;padding: 20px;margin: 20px;width: 200px;}h3 {margin: 10px 0 20px 0;}p {margin: 20px;}</style>
</head>
<body><div id="app"><div class="box"><h3>小黑自动售货机</h3><button @click="buy(5)">可乐5元</button><button @click="buy(10)">咖啡10元</button><button @click="buy(8)">牛奶10元</button></div><p>银行卡余额: {{ money }}元</p></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {money: 100},methods: {buy (price) {this.money -= price}}})</script>
</body>

v-bind

作用: 动态地设置html的标签属性

<body><div id="app"><!-- <img v-bind:src="imgUrl" v-bind:title="msg" alt=""> --><!-- 简写形式 --><img v-bind:src="imgUrl" v-bind:title="msg" alt=""></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {imgUrl: './imgs/10-01.png',msg: 'Hello 波仔'}})</script>
</body>

案例 - 波仔的学习之旅

<body><div id="app"><button v-show="index > 0" @click="--index">上一页</button><div><img :src="list[index]" alt=""></div><button v-show="index < list.length - 1" @click="++index">下一页</button></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {index: 0,list: ['./imgs/11-00.gif','./imgs/11-01.gif','./imgs/11-02.gif','./imgs/11-03.gif','./imgs/11-04.png','./imgs/11-05.png',]}})</script>
</body>

v-for

v-for基本使用

<body><div id="app"><h3>小黑水果店</h3><ul><li v-for="(item, index) in list">{{item}} - {{index}}</li></ul><ul><li v-for="item in list">{{item}}</li></ul></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {list: ['西瓜', '苹果', '鸭梨']}})</script>
</body>

案例 - 小黑的书架

filter: 根据条件, 保留满足条件的对应项, 得到一个新数组

<body><div id="app"><h3>小黑的书架</h3><ul><li v-for="(item, index) in booksList" :key="item.id"><span> {{item.name}} </span><span> {{item.author}} </span><!-- 通过 id 删除数组中的对应项(id比较稳定) --><button @click="del(item.id)">删除</button></li></ul></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {booksList: [{ id: 1, name: '《红楼梦》', author: '曹雪芹' },{ id: 2, name: '《西游记》', author: '吴承恩' },{ id: 3, name: '《水浒传》', author: '施耐庵' },{ id: 4, name: '《三国演义》', author: '罗贯中' }]},methods: {del(id){// 通过 id 删除数组中的对应项 -> filter(不会改变原数组)// filter: 根据条件, 保留满足条件的对应项, 得到一个新数组this.booksList = this.booksList.filter(item => item.id !== id)}}})</script>
</body>

v-for的key

key的作用: 给元素添加的唯一标识, 便于Vue进行列表项的正确排序复用
注意点
- key的值只能是字符串或数字类型
- key的值必须具有唯一性
- 推荐使用id作为key(唯一), 不推荐使用index作为key(会变化, 不对应)
不加key: v-for的默认行为会尝试原地修改元素(就地服用)

v-model

作用: 给表单元素使用, 双向数据绑定 -> 可以快速获取或设置表单元素的内容
- 数据变化, 视图自动更新
- 视图变化, 数据自动更新

<body><div id="app">账户：<input type="text" v-model="username"> <br><br>密码：<input type="password" v-model="password"> <br><br><button @click="login">登录</button><button @click="reset">重置</button></div><script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {username: '',password: ''},methods: {login(){console.log(this.username, this.password)},reset(){this.username = ''this.password = ''}}})</script>
</body>

综合案例 - 小黑记事本

功能总结:

列表渲染:
- v-for
- key的设置
- {{}}插值表达式
删除功能:
- v-on调用传参
- filter过滤
- 覆盖修改原数组
添加功能:
- v-model绑定
- unshift修改原数组添加
底部统计和清空
- 数组.length累计长度
- 覆盖数组清空列表
- v-show控制隐藏

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./css/index.css" />
<title>记事本</title>
</head>
<body><!-- 主体区域 -->
<section id="app"><!-- 输入框 --><header class="header"><h1>小黑记事本</h1><input placeholder="请输入任务" class="new-todo" v-model="todoName"/><button class="add" @click="add">添加任务</button></header><!-- 列表区域 --><section class="main"><ul class="todo-list"><li class="todo" v-for="(item, index) in list" :key="item.id"><div class="view"><span class="index"> {{index+1}}. </span> <label> {{item.name}} </label><button class="destroy" @click="del(item.id)"></button></div></li></ul></section><!-- 统计和清空 --><footer class="footer" v-show="list.length > 0"><!-- 统计 --><span class="todo-count">合 计:<strong> {{list.length}} </strong></span><!-- 清空 --><button class="clear-completed" @click="clear">清空任务</button></footer>
</section><!-- 底部 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>const app = new Vue({el: '#app',data: {list: [{id: 1, name: '跑步两公里'},{id: 2, name: '跳绳500下'}],todoName: ''},methods: {del(id){this.list = this.list.filter(item => item.id !== id)},add(){if(this.todoName.trim() === ''){alert('请输入任务名称')return}this.list.unshift({id: +new Date(),name: this.todoName})this.todoName = ''},clear(){this.list = []}}})</script>
</body>
</html>

来源

黑马程序员. Vue2+Vue3基础入门到实战项目

Web前端-Vue2+Vue3基础入门到实战项目-Day1(初始Vue, Vue指令, 小黑记事本)

Web前端-Vue2Vue3基础入门到实战项目-Day1 Vue快速上手创建一个Vue实例插值表达式Vue响应式特性 Vue指令指令初识和 v-htmlv-show 和 v-ifv-else 和 v-else-ifv-on内联语句methods处理函数调用传参 v-bind案例 - 波仔的学习之旅v-forv-for基本使用案例 - 小黑的书架v-for的key…...

编程日记 2023/10/1 16:24:37

Sentinel学习（2）——sentinel的使用，引入依赖和配置对消费者进行流控对生产者进行熔断降级

前言 Sentinel 是面向分布式、多语言异构化服务架构的流量治理组件，主要以流量为切入点，从流量路由、流量控制、流量整形、熔断降级、系统自适应过载保护、热点流量防护等多个维度来帮助开发者保障微服务的稳定性。本篇博客介绍sentinel的使用&#x…...

编程日记 2023/10/1 16:23:36

springboot 简单配置mongodb多数据源

准备工作： 本地mongodb一个创建两个数据库 student 和 student-two 所需jar包： # springboot基于的版本 <parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId>&l…...

编程日记 2023/10/1 16:21:34

西门子S7-1200使用LRCF通信库与安川机器人进行EthernetIP通信的具体方法示例

西门子S7-1200使用LRCF通信库与安川机器人进行EthernetIP通信的具体方法示例准备条件： PLC：S7-1200 1214C DC/DC/DC 系统版本4.5及以上。机器人控制柜：安川YRC1000。软件：TIA V17 PLC做主站，机器人做从站。具体方法可参考以下内容：使用的库文件为西门子 1200系列…...

编程日记 2023/10/1 16:17:31

pytorch第一天（tensor数据和csv数据的预处理）lm老师版

tensor数据： import torch import numpyx torch.arange(12) print(x) print(x.shape) print(x.numel())X x.reshape(3, 4) print(X)zeros torch.zeros((2, 3, 4)) print(zeros)ones torch.ones((2,3,4)) print(ones)randon torch.randn(3,4) print(randon)a …...

编程日记 2023/10/1 16:15:29

CSP-J第二轮试题-2021年-1.2题

文章目录参考：总结 [CSP-J 2021] 分糖果题目背景题目描述输入格式输出格式样例 #1样例输入 #1样例输出 #1 样例 #2样例输入 #2样例输出 #2 样例 #3样例输入 #3样例输出 #3 提示答案1答案2-优化 [CSP-J 2021] 插入排序题目描述输入格式输出格式样例 #1样例输入 #1样…...

编程日记 2023/10/1 16:14:28

怒刷LeetCode的第16天（Java版）

目录第一题题目来源题目内容解决方法方法一：迭代方法二：模拟方法三：循环模拟方法四：传递第二题题目来源题目内容解决方法方法一：回溯方法二：枚举优化第三题题目来源题目…...

编程日记 2023/10/1 16:13:27

让大脑自由

前言作者写这本书的目的是什么？ 教会我们如何让大脑更好地为自己工作。 1 大脑的运行机制是怎样的？ 大脑的基本运行机制是神经元之间通过突触传递信息，神经元的兴奋和抑制状态决定了神经网络的运行和信息处理，神经网络可以通过…...

编程日记 2023/10/1 16:11:25

Arcgis克里金插值报错：ERROR 010079: 无法估算半变异函数。执行(Kriging)失败。

Arcgis克里金插值报错：ERROR 010079: 无法估算半变异函数。执行(Kriging)失败。问题描述： 原因： shape文件的问题，此图可以看出，待插值的点有好几个都超出了地理范围之外，这个不知道是坐标系配准的问…...

编程日记 2023/10/1 16:10:24

Docker Compose安装

title: “Docker Compose安装” createTime: 2022-01-04T19:08:1508:00 updateTime: 2022-01-04T19:08:1508:00 draft: false author: “name” tags: [“docker”,“docker-compose”] categories: [“install”] description: “测试的” docker-compose安装步骤 1.下载 u…...

编程日记 2023/10/1 16:09:23

机器人过程自动化(RPA)入门 7. 处理用户事件和助手机器人

在UiPath中，有两种类型的Robot用于自动化任何流程。一个是后台机器人，它在后台工作。它独立工作，这意味着它不需要用户的输入或任何用户交互。另一个是前台机器人，也被称为助理机器人。本章介绍前台机器人。在这里，我们将了解自动化过程中通过简单按键、单击鼠标等触发事…...

编程日记 2023/10/1 16:08:22

在linux下预览markdown的方法，转换成html和pdf

背景 markdown是一种便于编写和版本控制的格式，但却不便于预览——特别是包含表格等复杂内容时，单纯的语法高亮是远远不够的——这样就不能边预览边调整内容，需要找到一种预览方法。思路 linux下有个工具，叫pandoc&#xff0c…...

编程日记 2023/10/1 16:05:19

AIOT入门指南：探索人工智能与物联网的交汇点

AIOT入门指南：探索人工智能与物联网的交汇点 1. 引言随着技术的快速发展，人工智能（AI）和物联网（IoT）已经成为当今最热门的技术领域。当这两个领域交汇时，我们得到了AIOT - 一个结合了AI的智能…...

编程日记 2023/10/1 16:03:18

CCC数字钥匙设计【NFC】 --车主配对流程介绍

1、车主配对流程介绍车主配对流程可以通过车内NFC进行，若支持UWB测距，也可以通过蓝牙/UWB进行，本文主要介绍通过NFC进行车主配对的流程。整个配对流程相对较为复杂，本文主要梳理整体的步骤流程，其中的每个细节流程未…...

编程日记 2023/10/1 16:02:16

一站式开源持续测试平台 MerterSphere 之测试跟踪操作详解

一、MeterSphere平台介绍 MeterSphere是一站式的开源持续测试平台，遵循 GPL v3 开源许可协议，涵盖测试跟踪、接口测试、UI 测试和性能测试等功能，全面兼容JMeter、Selenium 等主流开源标准，有效助力开发和测试团队充分利用云弹性进…...

编程日记 2023/10/1 16:01:16

自然语言处理状况简介

一、说明自然语言处理已经进入大模型时代，然而从业人员必须了解整个知识体系、发展过程、知识结构，应用范围等一系列知识。本篇将报道此类概况。二、自然语言处理简介自然语言处理，或简称NLP，是处理和转换文本的计算机科学学科…...

编程日记 2023/10/1 16:00:15

python爬虫基于管道持久化存储操作

文章目录基于管道持久化存储操作scrapy的使用步骤1.先转到想创建工程的目录下：cd ...2.创建一个工程3.创建之后要转到工程目录下4.在spiders子目录中创建一个爬虫文件5.执行工程setting文件中的参数基于管道持久化存储的步骤：持久化存储1：保…...

编程日记 2023/10/1 15:58:12

【MySQL】数据类型（二）

文章目录一. char字符串类型二. varchar字符串类型2.1 char和varchar比较三. 日期和时间类型四. enum和set类型4.1 set的查询结束语一. char字符串类型 char (L) 固定长度字符串 L是可以存储的长度，单位是字符，最大长度是255 MySQL中的字符&#xff…...

编程日记 2023/10/1 15:55:09

基于Matlab实现连续模型求解方法

本文介绍了如何使用Matlab实现连续模型求解方法。首先，我们介绍了连续模型的概念，并明确了使用ODE和PDE求解器来求解常微分方程和偏微分方程的步骤。然后，我们通过一个简单的例子演示了如何将问题转化为数学模型，并使用Matlab编写…...

编程日记 2023/10/1 15:52:05

Tomcat 与 JDK 对应版本关系

对应关系 Tomcat版本 jdk版本11.0.x JDK 21及以后10.1.x JDK11及以后10.0.xJDK1.8及以后9.0.x JDK1.8及以后8.5.xJDK1.7及以后8.0.x JDK1.7及以后查看对应关系方法： 登陆Tomcat官网：Apache Tomcat - Welcome! 结果：...

编程日记 2023/10/1 15:49:03

iOS自动化测试方案(二)：Xcode开发者工具构建WDA应用到iphone

文章目录一、环境准备1.1、软件环境1.2、硬件环境1.3、查看版本二、安装WDA过程2.7、构建失败，这类错误有很多，比如在选择开发者账号后，就会提示:Failed to register bundle identifier表示应用唯一注册失败2.9、第二个错误，完全…...

编程日记 2023/10/1 15:47:02

IDEA的Maven换源

前言 IDEA是个好东西，但是使用maven项目时可能会让人很难受，要么是非常慢，要么直接下载不了。所以我们需要给IDEA自带maven换源，保证我们的下载速度。具体操作打开IDEA安装路径，然后打开下面的文件夹 plugins\m…...

编程日记 2023/10/1 15:46:00

步进电机只响不转

我出现问题的原因是相位线接错。我使用的滑台上示17H的步进电机，之前用的是57的步进电机。 57步进电机的相位线是A黑、A-绿、B红、B-蓝。 17步进电机的相位线是A红、A-绿、B黑、B-蓝。这两天被一个问题困扰了好久，在调试步进电机开发板的时候电机发生…...

编程日记 2023/10/1 15:42:58

使用select实现服务器并发

select函数介绍： select 函数是一个用于在一组文件描述符上进行异步I/O多路复用的系统调用。它可以同时监视多个文件描述符，等待其中任何一个文件描述符准备就绪，然后进行相应的操作。以下是select函数的原型： #include <…...

编程日记 2023/10/1 15:40:56

【Python】基于OpenCV人脸追踪、手势识别控制的求实之路FPS游戏操作

【Python】基于OpenCV人脸追踪、手势识别控制的求实之路FPS游戏操作文章目录手势识别人脸追踪键盘控制整体代码附录：列表的赋值类型和py打包列表赋值BUG复现代码改进优化总结 py打包视频： 基于OpenCV人脸追踪、手势识别控制的求实之路FPS游戏操作手…...

编程日记 2023/10/1 15:38:54

力扣 -- 718. 最长重复子数组

解题步骤： 参考代码： class Solution { public:int findLength(vector<int>& nums1, vector<int>& nums2) {int m nums1.size();int n nums2.size();//多开一行，多开一列vector<vector<int>> dp(m 1, ve…...

编程日记 2023/10/1 15:36:52

MP、MybatisPlus、联表查询、自定义sql、Constants.WRAPPER、ew （二）

描述： 给定一个id列表，更新对应列表中动物的年龄，使得年龄都较少一岁。要求：使用条件构造器构造条件。 mapper： void updateAnimalAge(Param(Constants.WRAPPER) Wrapper<Animal> wrapper, Param("age&qu…...

编程日记 2023/10/1 15:35:51

Ubuntu服务器安全性提升：修改SSH默认端口号

在Ubuntu服务器上，SSH（Secure Shell）是一种至关重要的远程连接工具。它提供了一种安全的方式来远程连接和管理计算机系统，通过加密通信来确保数据的保密性和完整性。SSH协议广泛用于计算机网络中，用于远程管理、文件传…...

编程日记 2023/10/1 15:34:50

十七，IBL-打印各个Mipmap级别的hdr环境贴图

预滤波环境贴图类似于辐照度图，是预先计算的环境卷积贴图，但这次考虑了粗糙度。因为随着粗糙度的增加，参与环境贴图卷积的采样向量会更分散，导致反射更模糊，所以对于卷积的每个粗糙度级别，我们将按顺序把模…...

编程日记 2023/10/1 15:33:48

7、Docker网络

docker网络模式能干嘛？ 容器间的互联和通信以及端口映射容器IP变动时候可以通过服务名直接网络通信而不受到影响 docker 网络模式采用的是桥接模式，当我们创建了一个容器后docker网络就会帮我们创建一个虚拟网卡，这个虚拟网卡和我们的容器网…...

编程日记 2023/10/1 15:30:46

wordpress如何上传mp4/如何用html制作一个网页

说明：本文系交通攻城狮原创文章，如需转载请私信联系，侵权必究。2020，第 30 期，编程笔记建议直接阅读精编版：如何利用 Python 绘制酷炫的车辆轨迹 — 速度时空图？三维数据用二维图像呈现mp.w…...

编程日记 2025/1/11 18:23:41

做网站维护的是什么人/百度竞价排名费用

模块模块是非常简单的Python文件，单个Python文件就是一个模块，两个文件就是两个模块。 import语句是用来导入模块或者从模块里导入特定的类或者函数。如前面我们用过的math模块，从而可以使用sqrt函数来计算距离。假如有一个包含Database类的…...

编程日记 2025/1/11 17:43:06

php网站制作教程/友情链接可以帮助店铺提高浏览量

官网：express 初始化：npm init -y安装：npm i -S express引包：var express require(express); app.js // 1. 引包 var express require(express);// 2. 创建你的服务器应用程序（也就是原来的 http.createServer&…...

编程日记 2025/1/11 17:36:59

wordpress朋友圈主题/网站推广软件下载

combox存在问题界面加载完成信号 Component.onCompleted: { console.log(“1”) } combox盒子组件 combox{ model:{ console.log(“2”) } onActivated: { } onCurrentTextChanged: { } } 以上发现总是先打印2，再打印1； onCurrentTextChanged信号在i…...

编程日记 2025/1/11 17:35:59

怎么做网赌网站/网络营销的方式和方法

前言 Javascript是一门基于对象的动态语言，也就是说，所有东西都是对象，一个很典型的例子就是函数也被视为普通的对象。Javascript可以通过一定的设计模式来实现面向对象的编程，其中this “指针”就是实现面向对象的一个很重…...

编程日记 2025/1/11 16:27:17

用dz做网站怎么设置数据库/贴吧引流推广

代理模式和装饰器十分类似, 以如下图解释说明区别。装饰者在之前介绍装饰模式的时候就说明了它是在被装饰者的功能基础上，附加新的功能，而且被装饰者的接口必定会被调用的情况下才选用装饰模式来解决问题； 而代理者是先判断是否需要执行被…...

编程日记 2025/1/11 16:26:16