整个项目是一个主文件index.html,index.html中会引入src文件夹中的main.js,main.js中会导入顶级单文件组件App.vue,App.vue中会通过组件嵌套或者路由来引用其他页面组件文件,页面组件也可以嵌套或者路由引用的方式加载子组件。 组件有两种:脚本化组件、单文件组件 ...
转载
2021-10-02 13:07:00
273阅读
2评论
VUE框架CLI组件化插件的使用------VUE框架
原创
2024-05-06 10:34:03
76阅读
默认情况下,我们的项目中并没有对axios包的支持,所以我们需要下载安装。 在项目根目录中使用 npm安装包: npm install axios 接着在main.js文件中,导入axios并把axios对象 挂载到vue属性中多为一个子对象,这样我们才能在组件中使用。 main.js补充代码: i ...
转载
2021-10-01 21:35:00
384阅读
2评论
工程结构 启动工程 TodoList.vue TodoItem.vue
原创
2021-07-21 10:20:48
458阅读
vue-cli组件的使用(入门级) 1.创建组件 在src/components下创建一个vue组件,名为tree.vue <template> <p>hello</p></template><script>export default { //组件导出的名字 name: "Tree", data ...
转载
2021-08-02 12:13:00
235阅读
2评论
安装好的vue-cli,可以看到下面的目录: assets存放图片等文件。 components文件夹就类似templates文件夹,存放组件的。 main.js是创建一个vue。 App.vue是一个组件,以.vue结尾的文件都称为一个组件(html、js、css),组件第一个字幕必须是大写(因为
原创
2022-08-22 16:59:27
118阅读
前面显示Home.vue页面组件的内容时,我们是在App.vue通过import导入使用的。这个过程就是组件的嵌套使用。那么我们除了App.vue可以导入其他页面以外,也可以通过在Home.vue中导入其他子组件进行使用的。 src/ |- views/ |- Home.vue |- compone ...
转载
2021-10-01 21:30:00
200阅读
2评论
Vue CLI的使用 安装Vue脚手架 //默认安装最新版本 npm install g @vue/cli //或者一起安装脚手架全局服务器 npm install g @vue/cli @vue/cli service global 注意:我这里安装的是Vue CLI 4.1.2的版本 如果需要按
原创
2022-01-10 17:03:33
877阅读
一般在开发中,我们会人为把组件分2个目录存放,一个代表的页面组件,另一个代表页面一部分的子组件。 src/ |- views/ |- Home.vue |- components/ |- App.vue |- main.js 在组件中编辑三个标签,编写视图、vm对象和css样式代码。 1、templ ...
转载
2021-10-01 21:28:00
290阅读
2评论
一、组件之间的嵌套(普通)1、效果图2、MyFather.vue<template> <div> <MySon></MySon> </div></template><script>i
原创
2022-05-24 18:10:55
331阅读
在webpack-simple模板中,包括webpck模板。一个.vue文件就是一个组件。 为什么会这样呢?因为webpack干活了!webpack的将我
原创
2022-08-22 17:00:09
123阅读
vue-cli 新建组件1 新建home组件替代HelloWorld组件
主页组件 <div style="width: 100%;height: 400px;background: aquamarine;">
数据区域 2 根路径设置为home组件(修改index.js路径文件)import Vue from 'vue'import Router from
转载
2021-05-08 23:50:30
207阅读
2评论
一、单文件组件 https://cn.vuejs.org/v2/guide/single-file-components.html#ad # 原来写的组件存在的问题 全局定义 (Global definitions) 强制要求每个 component 中的命名不得重复 字符串模板 (String t
转载
2020-12-18 20:28:00
152阅读
2评论
组件有两种:脚本化组件、单文件组件 脚本化组件的缺点: html代码是作为js的字符串进行编写,所以组装和开发的时候不易理解,而且没有高亮效果。 脚本化组件用在小项目中非常合适,但是复杂的大项目中,如果把更多的组件放在html文件中,那么维护成本就会变得非常昂贵。 脚本化组件只是整合了js和html ...
转载
2021-10-01 21:24:00
151阅读
2评论
P13vue单文件组件vue-cli
原创
2022-01-19 16:30:19
75阅读
P13vue单文件组件vue-cli https://www.bilibili.com/video/av91679349?p=13
原创
2021-07-07 10:51:35
153阅读
Vue-cli是vue官方出品的快速构建单页应用的脚手架开发一个项目,在开始的时候,会构建项目结构、webpack、怎么运行、编写一些node指令等,还有在项目生产中用的命令,都需要做一个提前的编程。Vue-cli就做了这些事情,只要把它安装上,并进行初始化和一些简单的设置,就自动做好了在开发时需要的环境和结构目录,开发人员只专心的编写代码就可以了。Vue-cli牵扯的东西很多,有webpack,
转载
2023-07-12 10:41:55
47阅读
Vue CLI 使用 Axios
Axios 是一个基于 Promise 的 HTTP 客户端,用于在浏览器和 Node.js 中发送 HTTP 请求。它是 Vue.js 中最常用的 HTTP 请求库之一,因为它简单易用、功能强大,支持浏览器和 Node.js 环境,而且可以与 Vue CLI 集成得非常好。
本文将介绍如何在 Vue CLI 中使用 Axios 发送 HTTP 请求,并提供一
原创
2024-01-19 04:06:47
71阅读
先使用npm安装cli $ npm install -g @vue/cli 创建项目 vue create antd-demo 选择预设 ? Please pick a preset: (Use arrow keys) > preset01 ([Vue 3] babel, router, vuex, ...
转载
2021-08-06 14:26:00
267阅读
2评论
VUE多个组件示例 示例一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
原创
2022-06-23 12:10:17
690阅读