Vue
gxgalaxy
这个作者很懒,什么都没留下…
展开
-
报错ReferenceError: BASE_URL is not defined解决方法
运行vue项目报错:BASE_URL is not defined可以将<link rel="icon" href="<%= BASE_URL %>favicon.ico"> 换成: <link rel="icon" href="<%= htmlWebpackPlugin.options.url %>favicon.ico"> 即可...原创 2020-04-03 22:05:36 · 18844 阅读 · 3 评论 -
解决创建vue项目太慢问题(吐血经历)!!
在创建vue项目的时候,不知道原来坑这么深(emmmm是我太lj)。大家千万不要相信那些什么设置淘宝镜像。并没有什么用,还是慢的1b,不要问我是怎么知道的。后来发现了一个快速的方法,如下:这里使用的是vue2.x的使用init webpack创建的方法。1.创建项目:sudo vue init webpack projectName 2.完成一系列配置记住!!!最后一步Should ...原创 2020-04-02 22:28:06 · 10508 阅读 · 1 评论 -
vue数据管理vuex小demo练习
接着前面的demo继续练习,前面的练习地址主要练习数据管理Vuex,解决数据共享问题.主要涉及的知识点地址效果:项目文件目录:在昨天的基础上增加了数据管理仓库文件夹其中包含index.js 数据仓库文件movie.js 电影数据模块online.js 在线人数模块index.jsimport movies from "./movies.js"import online fr...原创 2020-03-29 23:07:21 · 355 阅读 · 0 评论 -
vue数据管理vuex知识详解
文章目录数据管理安装初始化状态状态模块化数据变化追踪数据变化启用命名空间异步处理数据管理在实际的开发中,经常会遇到多个组件共享一个数据的场景面对这种场景,会产生至少以下两个问题:多个组件如何共享同一份数据?如果某个组件修改了数据,如何让其他组件知道?面对这种问题,一个可行的解决办法,就是让数据提升所谓数据提升,就是把数据提升到更加顶层的组件,让顶层的组件通过属性下发数据,而当组...原创 2020-03-29 21:26:39 · 470 阅读 · 0 评论 -
vue路由小demo练习
路由知识详解地址接着前面的demo地址继续练习路由知识.主要完成首页和电影无刷新跳转切换以及动态路由.实际就是组件之间的切换先上效果图首页:(简单表示一下)电影页:假设有一个电影详情页,详情页需要根据电影的id来获取电影对象,然后渲染组件那么电影详情页的地址中就需要包含电影的id这里就涉及到三个问题:如何把动态地址(地址某一部分会变化)匹配到组件如何在组件中获取到动态部分的...原创 2020-03-28 23:32:47 · 1090 阅读 · 0 评论 -
vue路由知识详解
文章目录vue路由安装组件切换的位置路由规则配置路由模式配置路由跳转超链接跳转router-link组件匹配的类样式命名路由代码跳转$route$router动态路由匹配动态地址获取动态内容路由跳转时传递动态内容vue路由一个站点由很多页面组成,需要在不同的页面之间切换在vue中,可以把每个页面看作是一个组件,页面的切换,实际上就是组件的切换显示除了可以手动的实现组件切换,还可以利用vue...原创 2020-03-28 21:51:18 · 818 阅读 · 0 评论 -
vue组件通信小demo练习
本次练习是在上次vue组件练习的基础上增加了分页和朦层的效果。组件化开发练习文章见地址先上效果图:目录结构:在上次的基础上添加了分页组件Pager.js和朦层组件Loading.js和Modal.js以及修改了容器组件MovieContainer在分页展示过程中,添加了页码,当用户发生点击事件时,分页组件获取到newPage(新页面),由于不是自己的数据,无法进行修改.这时候触发事件...原创 2020-03-26 22:17:11 · 461 阅读 · 0 评论 -
vue组件通信(触发事件、注册事件)详解
文章目录组件事件v-model插槽组件事件组件之间经常都会发生消息的传递,我们称之为组件通信prop是组件通信的一种,消息从父组件传递到子组件但还有一些场景,就是子组件中发生了一件事,可是它没有能力处理这件事,需要使用它的人来处理,此时,就需要事件 event例如,倒计时组件停止了,可是停止之后干嘛呢?在不同的场景要做不同的事情,可能什么也不做,可能在页面上显示倒计时结束了,也可能把计时...原创 2020-03-26 21:54:55 · 2106 阅读 · 0 评论 -
Vue组件化开发小demo练习
vue组件化知识详解:地址使用vue组件化开发完成以下电影展示页面ajax请求地址:地址目录结构:其中movieService.js为ajax请求获取数据MovieContainer.js该组件仅用于获取电影数据MovieItem.js 该组件用于展示一条电影MovieList.js 该组件用于展示多个电影index.js 该组件负责新创建一个Vue实例html文件:<...原创 2020-03-25 21:15:42 · 1022 阅读 · 0 评论 -
Vue组件知识详解
文章目录组件概念组件开发创建组件使用组件注册组件应用组件组件树向组件传递数据组件实例的生命周期组件概念一个完整的网页是复杂的,如果将其作为一个整体来进行开发,将会遇到下面的困难代码凌乱臃肿不易协作难以复用vue推荐使用一种更加精细的控制方案——组件化开发所谓组件化,即把一个页面中区域功能细分,每一个区域成为一个组件,每个组件包含:功能(JS代码)内容(模板代码)样式(CS...原创 2020-03-25 20:23:44 · 727 阅读 · 0 评论 -
vue模板与配置小demo练习
通过使用vue模板和配置中的知识完成下面的demo可以增加和减少商品的库存,删除商品,同时商品的库存会发生改变。使用到的知识点:v-for插值注册事件 v-onv-showkeydown.enter代码实现:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...原创 2020-03-24 22:31:12 · 228 阅读 · 0 评论 -
vue模板与配置
文章目录准备工作基本原理创建vue工程创建vue实例数据响应式模板的编译模板和配置模板插值指令配置准备工作编辑器和插件编辑器:vscode插件:live server,自动搭建一个简易的本地服务器,可以从服务器访问页面vue是什么?vue的官网:https://cn.vuejs.org/vue是一个渐进式的javascript框架渐进式:vue可以和其他传统(比如jqu...原创 2020-03-24 21:54:37 · 607 阅读 · 0 评论 -
Vue实现拼图小游戏
需要的主要参数App.vue<template> <div> <!-- 子组件通过自己触发next事件与父组件进行通信 --> <d-puzzle v-bind="puzzleConfig[level]" @next = "handleNext"></d-puzzle> </...原创 2020-03-19 16:10:49 · 1330 阅读 · 2 评论 -
Ubuntu18.04搭建VUE环境 VSCode
目录1.nodejs下载安装2.npm安装下载3.更新4.Vue安装1.安装手脚架工具@vue/cli5.在VSCode中下载Vtur插件6.错误集锦1.nodejs下载安装下载更新前先更新软件源sudo apt-get update安装nodesudo apt-get install nodejs查看版本(版本号应该在8.8以上)nodejs -v我这里使用的是2.np...原创 2020-03-15 20:22:33 · 1641 阅读 · 1 评论