前端-Vue基础1 - 相关文章

【前端-Vue基础1】的更多相关文章

[前端] VUE基础 (6) (v-router插件、获取原生DOM)

一.v-router插件 1.v-router插件介绍 v-router是vue的一个核心插件,vue+vue-router主要用来做SPA(单页面应用)的. 什么是SPA:就是在一个页面中,有多个页签,我们选择页签显示不同的内容,但页面不跳转. 例如: 在网易云音乐的主页中,发现音乐.我的音乐.朋友这三个页签就是单页面应用.当我们切换他们时,可以观察到url的变化: 这里看到的url改变(路由改变)的路由是vue-router提供的,而不是对应django的路由系统(前后端分离的项目,djan…

前端Vue基础学习

Vue基础对与vue的简洁明了的干货分享,适合小白学习观看,如果有笔误或者想了解更多的,请给笔者留言,后续会继续分享,从零开始的vue相关经验 1.创建vue实例 <div id="app"></div> const vm = new Vue({ el:'app', data:{ } }) 2.插值语法  <div id="bo…

[前端] VUE基础 (9) (element-ui、axios、Vuex)

一.element-ui的使用官方网页:https://element.eleme.cn/#/zh-CN 1.安装element-ui (venv) D:\pycharm_workspace\vue_learn\leeoo>cnpm i element-ui -S √ Installed packages √ Linked latest versions √ Run scripts √ All packages installed ( packages installed from npm r…

[前端] VUE基础 (8) (vue-cli脚手架)

一.安装vue-cli脚手架官方文档:https://cli.vuejs.org/zh/guide/cli-service.html Vue CLI 的包名称由 vue-cli改成了 @vue/cli . 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g或 yarn global remove vue-cli 卸载它. Vue CLI 需要Node.js 8.9 或更高版本 (推荐 8.11.0+).使用命令…

[前端] VUE基础 (5) (过滤器、生命周期、钩子函数)

一.过滤器过滤器分为局部过滤器和全局过滤器. 1.局部过滤器 <body> <div id="app"> </div> <script src="./static/vue.js"></script> <script> // 定义App let App = { data() { return { msg: 'Hello World' } }, // 使用msg的时候,使用管道符号传递给filte…

前端-Vue基础3（父子组件交互）

1.子组件往父组件传值点击子组件的值,子组件自增,父组件的值也跟着自增通过:this.$emit('change')方法向父组件暴露事件,在子组件中引用,可以调用父组件的方法点击子组件触发click事件,调用子组件的add方法子组件的add方法触发了父组件的事件,调用了父组件的changeAdd方法 <body> <div id="app">  <number @change="countAdd…

前端-Vue基础2

1.过滤器前台通过后台传值,要对后台传过来的变量进行特殊处理,比如根据id转成中文等: 1.1 局部过滤器局部过滤器只针对一个Vue实例默认将|左侧count传递给右侧方法 {{count|filterFunc}} 可以传多个参数{{count|filterFunc("test")}} func:function(value,test){ } <body> <div id="app"> {{count|change('百分比')}} {…

前端-Vue基础1

Vue核心思想:只要改变数据,页面就会发生改变 1.引入vue 1.下载vue.js 2.在script标签的src属性中,引入vue.js <script src="js/vue.js"></script> 2.vue实例 el:vue接管的div元素,注:只能接管一个div,所有需要vue处理的,必须写在这个div中 data:数据 methods:方法 new Vue({ //接管一个div el:'#app', data:{ msg:'test', co…

前端总结·基础篇·JS（二）数组深拷贝、去重以及字符串反序和数组（Array）

目录这是<前端总结·基础篇·JS>系列的第二篇,主要总结一下JS数组的使用.技巧以及常用方法. 一.数组使用 1.1 定义数组 1.2 使用数组 1.3 类型检测二.常用技巧 2.1 数组去重 2.2 数组深拷贝 2.3 字符串反序三.方法列表 3.1 存取 3.2 字符串 3.3 修改 3.4 ES5 3.5 ES2015(ES6) 3.6 ES2016 一.数组使用数组不是基本数据类型,但是非常常用,所以提前总结. 基本数据类型是String,Number,Boolean,null…

前端总结·基础篇·JS（三）arguments、callee、call、apply、bind及函数封装和构造函数

前端总结系列前端总结·基础篇·CSS(一)布局前端总结·基础篇·CSS(二)视觉前端总结·基础篇·CSS(三)补充前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前端总结·基础篇·JS(二)数组深拷贝.去重以及字符串反序和数组(Array) 前端总结·基础篇·JS(三)arguments.callee.call.apply.bind及函数封装和构造函数目录一.函数使用 1.1 函数声明和函数表达式 1.2 函数封装(自调用函数.闭包) 1.3 函数属性(a…