
Vue
文章平均质量分 58
IT之一小佬
敲响键盘之乐,跳起程序之舞,抵达智慧之巅!
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Vue之Element-ui和Vue-cli的使用
Element-ui 单文件组件就像是一个个封装好的页面样板,我们可一把这些样板组合在一起形成一个完整的页面。就像QQ空间装扮一样,将个个样板放入QQ空间页面中组成自己风格的页面。而Element-ui就将我们需要的样式封装成单文件组件,我们可以直接集成到我们的项目中。 在main.js中将emelent-ui引入到项目中 import Vue from 'vue' import App from './App.vue' import router from './router/rout原创 2021-07-20 21:04:16 · 837 阅读 · 1 评论 -
Vue多个单文件组件使用
在project目录下创建components文件夹,然后将所有子组件放入components文件夹下 【创建此目录】【文件名的首字母大写】 1、多组件嵌套使用 Child1.vue <template> <div>子组件1</div> </template> <script> // export default { // } </script> <style> </style> .原创 2021-07-20 20:54:58 · 567 阅读 · 1 评论 -
Vue单文件组件的使用
项目搭建完成后需要分别对 main.js , index.html , App.vue 文件进行编写代码 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http原创 2021-07-20 20:15:14 · 469 阅读 · 0 评论 -
Vue单文件组件环境配置
单文件组件不能直接运行使用,需要依赖node项目对其进行解析打包,在使用之前需要先进行环境配置 安装node版本管理工具nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash // 更新配置 source .bashrc 安装最新版本的node 【通过 node -V 来查看是否已经安装 ,这行命令在任何地方都可以执行】 nvm ...原创 2021-07-20 19:40:12 · 325 阅读 · 0 评论 -
Vue单文件组件
将一个组件相关的html结构,css样式,以及交互的JavaScript代码从html文件中剥离出来,合成一个文件,这种文件就是单文件组件,相当于一个组件具有了结构、表现和行为的完整功能,方便组件之间随意组合以及组件的重用,这种文件的扩展名为“.vue”,比如:"breadcrumb.vue"。 // 使用template标签来定义html部分 <template> <div :class="{crumb:true,hot:isHot}" @click="isHot=!isHo原创 2021-07-20 17:04:22 · 268 阅读 · 0 评论 -
Vue组件中的data和props属性
组件中数据的绑定 在vue中数据通过data属性进行绑定,如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content原创 2021-07-20 16:45:09 · 1151 阅读 · 0 评论 -
Vue组件
Vue组件 组件(Component)是Vue.js最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。就像是python中封装一个类,在其他类中可以继承和调用类中的属性和方法。所有的 Vue 组件同时也都是 Vue 的实例,所以可接受相同的选项对象 (除了一些根级特有的选项) 并提供相同的生命周期钩子。 组件的基本使用 全局组件的使用 <!DOCTYPE html> <html lang="en"> <head> <meta char原创 2021-07-20 15:53:02 · 196 阅读 · 0 评论 -
Vue之axios发送Ajax请求
2.10 axios发送ajax请求 axios github 2.10.1 准备工程 创建一个django工程,例如 login.创建完成之后,再创建一个子应用,例如users.最后再设置一下模板文件 2.10.2 准备html和html显示 在模板文件中创建一个axios.html,内容如下 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>原创 2021-07-08 10:48:25 · 257 阅读 · 0 评论 -
Vue之Todolist案例和ES6语法
2.7 Todolist案例 2.7.1 准备工作 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 开发环境版本 --> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> &原创 2021-07-08 10:39:23 · 386 阅读 · 0 评论 -
Vue之for列表渲染、methods事件和model表单绑定
for列表渲染 文档 v-for指令可以绑定数组的数据来渲染一个项目列表 v-for指令需要使用item in items形式的特殊语法,items是源数据数组并且item是数组元素迭代的别名。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 开发环境版本 --> <script原创 2021-07-08 10:11:38 · 618 阅读 · 1 评论 -
Vue之概述、基本使用、data数据和if条件渲染
一、Vue概述 Vue.js是前端三大新框架:Angular.js、React.js、Vue.js之一,Vue.js目前的使用和关注程度在三大框架中稍微胜出,并且它的热度还在递增。 Vue.js读音 /vjuː/, 类似于 view Vue.js是一个轻巧、高性能、可组件化的MVVM库,同时拥有非常容易上手的API Vue.js是一个构建数据驱动的Web界面的库 Vue.js是一套构建用户界面的 渐进式框架 通俗的说: Vue.js是一个构建数据驱动的 web 界面的渐进式框架原创 2021-07-08 09:35:12 · 771 阅读 · 1 评论