整个项目是一个主文件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 
vue
转载 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
vue
原创 2021-07-07 10:51:35
153阅读
Vue-clivue官方出品快速构建单页应用脚手架开发一个项目,在开始时候,会构建项目结构、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阅读
  • 1
  • 2
  • 3
  • 4
  • 5