随笔分类 - Vue3
摘要：在项目根目录中执行如下命令： npm run build 注：Vue脚手架打包的项目必须在服务器上运行，不能直接双击运行； 在打包之后项目中出现 dist 目录，dist 目录就是 Vue脚手架项目的生产目录（直接部署目录）。
阅读全文
摘要：上面是将Forecast组件作为了Home的子组件使用，现在我们将其作为一个路由组件使用。 在router/index.js路由系统注册路由： { path: '/forecast', name: 'Forecast', // route level code-splitting // this g
阅读全文
摘要：Nav组件和Forecast组件都是Home组件的子组件。 （1）子组件传递数据给父组件 在子组件中，通过this.$emit('自定义事件名', 参数1,参数2,...)来调用父组件中定义的事件. 子组件Nav.Vue添加： watch:{ city(){ this.$emit("getCity"
阅读全文
摘要：安装 axios： 1 npm install axios --save-dev 接着在src目录下创建一个http.js脚本中，导入axios并通过create方法实例化一个http请求对象，这样我们才能在组件中使用。 src/http.js，代码： 1 2 3 4 5 6 7 8 9 10 im
阅读全文
摘要：整个项目是一个主文件index.html，index.html中会引入src文件夹中的main.js，main.js中会导入顶级单文件组件App.vue，App.vue中会通过组件嵌套或者路由来引用其他页面组件文件，页面组件也可以嵌套或者路由引用的方式加载子组件。 组件有两种：脚本化组件、单文件组件
阅读全文
摘要：一、创建项目 vue create hello-world 你会被提示选取一个 preset。你可以选默认的包含了基本的 Babel + ESLint 设置的 preset，也可以选“手动选择特性”来选取需要的特性。 这个默认的设置非常适合快速创建一个新项目的原型，而手动设置则提供了更多的选项，它们
阅读全文
摘要：关于旧版本 Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。 Node 版本
阅读全文
摘要：Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供： 通过 @vue/cli 实现的交互式的项目脚手架。 通过 @vue/cli + @vue/cli-service-global 实现的零配置原型开发。 一个运行时依赖 ( @vue/cli-service )，该依赖： 可升级
阅读全文
摘要：1、get方法发送Ajax请求 // 直接在 URL 上添加参数 ID=12345 axios.get('/user?ID=12345') .then(function (response) { console.log(response); }) .catch(function (error) {
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcdn.net/ajax/libs/vue/3.1.2/vue.globa
阅读全文
摘要：一、计算属性 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如，有一个嵌套数组对象：我们想根据 author 是否已经有一些书来显示不同的消息 <div id="computed-basics"> <p>Has published boo
阅读全文
摘要：我们用 methods 选项向组件实例添加方法，它应该是一个包含所需方法的对象： <div id="app"></div> <script> const app = Vue.createApp({ data() { return {count: 4} }, methods: { increment(
阅读全文
摘要：Vue.js 使用了基于 HTML 的模板语法，允许开发者声明式地将 DOM 绑定至底层组件实例的数据。所有 Vue.js 的模板都是合法的 HTML，所以能被遵循规范的浏览器和 HTML 解析器解析。 在底层的实现上，Vue 将模板编译成虚拟 DOM 渲染函数。结合响应性系统，Vue 能够智能地计
阅读全文
摘要：Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。我们不再和 HTML 直接交互了。一个 Vue 应用会将其挂载到一个 DOM 元素上 (对于这个例子是 #app) 然后对其进行完全控制。那个 HTML 是我们的入口，但其余都会发生在新创建的 Vue 实例内部。
阅读全文
摘要：Vue.js 设计的初衷就包括可以被渐进式地采用。这意味着它可以根据需求以多种方式集成到一个项目中。 将 Vue.js 添加到项目中主要有四种方式： 1、在页面上以 CDN 包的形式导入。 <script src="https://cdn.bootcdn.net/ajax/libs/vue/3.1.
阅读全文
