Vue
关注
分享
扫一扫
文章平均质量分 77
Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。
别影响我打怪
QQ:1909832004
展开
-
vue——组件插槽
1、组件插槽的作用父组件向子组件传递内容（模板中的内容）组件最大的特性就是复用性，插槽能大大提高组件的复用性提供一个插槽的位置；提供插槽的内容2、组件插槽的基本用法1.插槽位置Vue.component('alert-box',{template:'<div class="demo-alert-box"><strong>炸酱面</strong></div><slot></slot></div>'})<原创 2021-07-22 16:22:08 · 226 阅读 · 0 评论 -
vue组件间数据交互
1.父组件向子组件传值2.子组件向父组件传值3.非父子间组件传值1.父组件向子组件传值组件内部通过props接收传递过来的值Vue.component('menu-item',{ props:['title'], template:'<div>{{title}}</div>'})父组件通过属性将值传递给子组件<menu-item title="来着父组件的值"></ment-item><menu-item :ti.原创 2021-07-22 14:21:38 · 202 阅读 · 3 评论 -
Vue组件化开发
组件组件 (Component) 是 Vue.js 最强大的功能之一组件可以扩展 HTML 元素，封装可重用的代组件系统是 Vue 的另一个重要概念，因为它是一种抽象，允许我们使用小型、独立和通常可复用的组件构建大型应用。仔细想想，几乎任意类型的应用界面都可以抽象为一个组件树：组件注册全局注册Vue.component(‘组件名称’, { }) 第1个参数是标签名称，第2个参数是一个选项对象全局组件注册后，任何vue实例都可以用<div id="example">原创 2021-07-21 16:54:13 · 87 阅读 · 0 评论 -
Vue综合实例——图书管理（2）
图书列表图书增加图书删除图书修改图书列表[1] 实现静态列表效果[2] 基于数据实现模板效果[3] 处理每行的操作按钮@click.prevent 阻止事件的默认行为，阻止标签跳转<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/c.原创 2021-07-19 12:01:45 · 419 阅读 · 2 评论 -
Vue综合实例——数组相关知识（1）
实例中用到的只是;1.自定义指令，计算属性，侦听器2.生命周期实现的效果如下图：本实例最核心的业务逻辑是数据处理，列表的话会用到数组，vue对数组的处理有一些特殊的地方，现在来简单介绍一下。数组相关API变异方法（修改原有的数组） push() pop() shift() unshift() splice() 删除数组中指定的元素 sort() 排序 reverse() 数组元素的反转vue对于数据的处理都是响应式的，数组的情况默认情况下并不是默认的，所.原创 2021-07-15 15:29:31 · 429 阅读 · 0 评论 -
Vue常用特性
Vue常用特性表单基本操作获取单选框中的值通过v-model1、 两个单选框需要同时通过v-model 双向绑定 一个值 2、 每一个单选框必须要有value属性 且value值不能一样 3、 当某一个单选框选中的时候 v-model会将当前的value值 改变data中的数据4、gender的值就是选中的值，我们只需要实时监控他的值即可<input type="radio" id="male" value="1" v-model='gender'> &原创 2021-07-15 09:04:21 · 249 阅读 · 0 评论 -
VScode新建vue项目报错解决办法
vue : 无法加载文件 D:\nodejs\node_install\vue.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。所在位置 行:1 字符: 1vue init webpack first + CategoryInfo : SecurityError: (:) []，PSSecurityException原创 2021-07-08 15:46:19 · 1102 阅读 · 0 评论 -
vue——生命周期
Vue实例的生命周期什么是生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的时间，这些事件，都统一称为生命周期！生命周期钩子：就是生命周期时间的别名而已；生命周期钩子=生命周期函数=生命周期函数主要的生命周期函数分类： 创建期间的生命周期函数：1、beforeCreate:实例已经在内存中被创建出来，此时，还没有初始化好data和methods属性2、created：实例已经在内存中创建好了，此时的data和methods已经创建好了，只是还没有开始编译模板3原创 2021-07-08 10:21:22 · 100 阅读 · 0 评论 -
vue综合实例——音乐播放器（悦听player）
1.歌曲搜索2.歌曲播放3.歌曲封面4.歌曲评论5.播放动画6.mv播放歌曲搜索1.按下回车(v-on,enter)2.查询数据(axios接口v-model)3.渲染数据(v-for 数组 that)服务器返回的数据比较复杂时，获取的时候需要注意层级结构通过审查元素快速定位到需要操纵的元素歌曲播放1.点击播放(v-on 自定义参数)2.歌曲地址获取(接口 歌曲id)3.歌曲地址设置(v-bind)歌曲id依赖歌曲搜索的结果，对于不用的数据也需要.原创 2021-07-05 17:55:18 · 1480 阅读 · 2 评论 -
vue基础（四）----天知道（天气查询）
Vue结合网络数据开发应用axios（网络请求库）axios+vue强大的网络请求库：语法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-.原创 2021-07-05 14:23:51 · 678 阅读 · 1 评论 -
vue基础（三）-----记事本
记事本实现新增、删除、统计、清空以及隐藏的功能新增生成列表结构(v-for ）数组获取用户输入(v-model)回车,新增数据(v-on .enter 添加数据)删除数据改变,和数据绑定的元素同步改变事件的自定义参数splice方法的作用统计统计信息个数(v-text length)基于数据的开发方式v-text指令的作用清空没有数据时,隐藏元素(v-show v-if 数组非空)在这里插入代码片...原创 2021-07-02 17:18:58 · 482 阅读 · 1 评论 -
vue基础(二)
本地应用1. 内容绑定,事件绑定v-textv-htmlv-on2. 显示切换,属性绑定v-showv-ifv-bind3. 列表循环,表单元素绑定v-forv-on补充v-modelv-text<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="原创 2021-07-02 15:09:24 · 141 阅读 · 0 评论 -
vue基础(（一）
@第一个vue程序Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。Vue简介JavaScript框架简化Dom操作响应式数据驱动第一个Vue程序<!DOCTYPE html><html lang="原创 2021-06-30 14:09:14 · 97 阅读 · 0 评论 -
阿里云七天训练营ECS——快速搭建Docker环境（第二天）
文章目录基于ECS快速搭建Docker环境创建资源连接ECS服务器安装Docker CE配置阿里云镜像仓库（镜像加速）使用Docker安装Nginx服务基于ECS快速搭建Docker环境创建资源在页面左侧，单击云产品资源下拉菜单，查看本次实验资源。单击免费开通创建所需资源。说明：资源创建过程需要1~3分钟。完成实验资源的创建后，您可以在云产品资源列表查看已创建的资源信息，例如：IP地址、用户名和密码等。连接ECS服务器打开系统自带的终端工具。Windows：CMD或Powe原创 2020-09-24 20:58:06 · 303 阅读 · 0 评论 -
阿里云ECS 7天实践训练营------基于ECS搭建FTP服务
文章目录基于ECS搭建FTP服务创建资源远程连接ECS服务器安装vsftpd配置vsftpd客户端测试基于ECS搭建FTP服务创建资源创建资源在页面左侧，单击 云产品资源 下拉菜单，查看本次实验资源。单击 免费开通 创建所需资源。远程连接ECS服务器打开系统自带的终端工具。Windows：CMD或Powershell。MAC：Terminal。Windows用户请检查系统中是否安装有ssh工具。检查方法：在终端中输入命令ssh -V。出现如下结果说明已安装。否则原创 2020-09-23 21:20:47 · 211 阅读 · 0 评论