![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue 小实例
文章平均质量分 60
肖朋伟
订阅号:JavaJobs
展开
-
若依vue版菜单点不开 Error: Cannot find module ‘@/views/system/user/index‘
若依 vue 版菜单点不开,报错:Error: Cannot find module ‘@/views/system/user/index’问题描述今天运行后端哥哥都爱的若依项目:RuoYi-Vue 的时候,发现可以正常启动,但是左侧菜单点不开,一直在加载中。然后 F12 一看控制台一顿输出:Error: Cannot find module '@/views/system/user/index' at webpackEmptyContext (index.js:39) at per原创 2021-12-05 13:45:15 · 17991 阅读 · 6 评论 -
CSS3 实现 div 上下滑入滑出效果
CSS3 实现 div 上下滑入滑出效果本篇内容:1,首先需要用的是 CSS3 的 target 选择器,配合a标签指定id选择器切换目标元素,用于选取当前活动的目标元素。 (当然也可以不用 a 便签,页面加载的时候自动滑动)2,CSS3 的 transition 动画,这里不做详细介绍动图展示:滑动效果源代码<!DOCTYPE html><html lang="...原创 2019-03-05 23:17:01 · 18659 阅读 · 0 评论 -
Vue 框架-12-Vue 项目的详细开发流程
Vue 框架-12-Vue 项目的详细开发流程首先,如果你还不了解 Vue 脚手架怎么搭建?默认的环境中有哪些文件?文件大概是什么作用?那么,您要先查看之前的文章才有助于你理解本篇文章:Vue 框架-10-搭建脚手架 CLI + 批处理快捷启动 Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置(一)Vue 组件及环境依赖介绍大家打开 Vue 脚手架的环境...原创 2018-11-16 17:51:14 · 2022 阅读 · 0 评论 -
Vue 框架-08-基础实战 demo
Vue 框架-08-基础实战 demo前面介绍了有 7 篇了,都是小实例,没有相对完整的应用,虽然有些功能挺实用,但还是有的不常用的,今天记录一篇关于前几篇基础内容的实战 demo,也是对 Vue 基础的简单应用。来看截图:源代码 html 文件:&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &原创 2018-11-14 14:56:02 · 1458 阅读 · 0 评论 -
Vue 框架-07-循环指令 v-for,和模板的使用
Vue 框架-07-循环指令 v-for,和模板的使用本章主要是写一些小实例,记录代码,想要更详细的话,请查看官方文档:https://cn.vuejs.org/v2/guide/#条件与循环第一个小实例:使用 v-for 遍历 js 文件中定义的数组源代码 html 文件:&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt; &amp;lt;head&am原创 2018-11-14 13:09:51 · 2124 阅读 · 0 评论 -
Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置
Vue 框架-11-介绍 src 文件流程及根组件 app这是上一篇对目录简单介绍:关于编辑器,使用的是 HBuilder,直接【文件】&amp;amp;gt;【打开目录】然后选择项目目录就可以了:然后可以看到:先介绍 main.js(请看注释):根组件 App.vue(请看注释):App.vue:&amp;amp;lt;!--拓展一个面试小知识点:浏览器页面的有哪几层构成,分别是什么?三层构成:结构层...原创 2018-11-15 22:20:13 · 2188 阅读 · 2 评论 -
Vue 框架-10-搭建脚手架 CLI + 批处理快捷启动
Vue 框架-10-搭建脚手架 CLI脚手架是通过 webpack 搭建的开发环境使用 ES6 语法打包和压缩 JS 为一个文件项目文件在环境中,而不是浏览器实现页面自动刷新环境准备1.安装 node.js官网:https://nodejs.org/zh-cn/2.打开终端或者 cmd 使用下面两个命令进行测试:要求:node 版本 &amp;amp;gt;6.9.0...原创 2018-11-15 21:05:33 · 2239 阅读 · 0 评论 -
Vue 框架-09-初识组件的应用
Vue 框架-09-初识组件的应用今天的第一个小实例,初步使用组件:在 app.js 中定义模板组件,在 html 文件中使用自定义标签来显示 js 文件中定义的 html 代码块比如说,下面定义一个模板,提示我的 csdn 连接,可以这样使用:源代码 app.js 文件://定义模板,因为在 html 中对应一个自定义标签模板,所以内容也只能是一对标签Vue.component("t...原创 2018-11-15 19:57:59 · 828 阅读 · 0 评论 -
Vue 框架-06-条件语句 v-if 实现选项卡效果
Vue 框架-06-条件语句 v-if 实现选项卡效果本片介绍的是 Vue 中条件语句 v-if第一个小实例是,通过 v-if=“布尔值”,通过布尔值的真假来决定,某元素是否显示源代码 html 文件:&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"原创 2018-11-14 00:27:13 · 3245 阅读 · 0 评论 -
Vue 框架-05-动态绑定 css 样式
Vue 框架-05-动态绑定 css 样式今天的小实例是关于 Vue 框架动态绑定 css 样式,这也是非常常用的一个部分首先说一下 动态绑定,相对的大家都知道静态绑定,静态绑定的话,直接加 class=“”就可以了,使用 Vue 呢之前也介绍过一个 v-bing:class="{{redClass:true}}" ,也可以实现绑定,但都不是动态绑定,动态绑定肯定是根据用户的某个操作实现动态的...原创 2018-11-13 23:45:13 · 9581 阅读 · 2 评论 -
Vue 框架-04-计算属性 computed
Vue 框架-04-计算属性计算属性是什么?大家可以去看官网解释:计算属性和侦听器今天的第一个小实例:为啥先放折磨一个实例,之前数据绑定的就已经可以实现了,看起来那么简单,就是为了告诉大家,当点击第一个按钮【Add to A】的时候,Age + A = 这个方法执行了,大家可以看得到实际呢,下面的两个方法都会刷新,虽然 Age + B = 没有效果,是因为没有修改数据,后面会详细说明...原创 2018-11-13 22:39:23 · 1493 阅读 · 0 评论 -
Vue 框架-03-键盘事件、健值修饰符、双向数据绑定
Vue 框架-03-键盘时间及健值修饰符一、键盘事件,当按键盘时,在控制台输出提示html 源码:&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;VueLearn原创 2018-11-13 21:35:33 · 883 阅读 · 0 评论 -
Vue 框架-02-事件:点击, 双击事件,鼠标移上事件
Vue 框架-02-事件:点击, 双击事件,鼠标移上事件1.单击事件:v-on:click源码 app2.js ://实例化 vue 对象new Vue({ //注意代码格式 //el:element 需要获取的元素,一定是 html 中的根容器元素 el:"#vue-app", data:{ name:"肖朋伟", age:18 }, //存储自己的方法...原创 2018-11-07 16:21:22 · 14762 阅读 · 0 评论 -
使用 npm 安装 Vue
使用 npm 安装 Vue需要 node.js 就不多说了(从 nodejs.org 中下载 nodejs )(1)安装 Vue,在 cmd 里直接输入:npm install -g cnpm --registry=https://registry.npm.taobao.org回车,等待(2)安装 Vue Cli,在 cmd 里直接输入:npm install -g @vue/cli...原创 2018-11-07 12:26:49 · 2515 阅读 · 0 评论 -
Vue 框架-01- 入门篇 图文教程
Vue 框架-01- 入门篇 图文教程Vue 官网:https://cn.vuejs.org/关于 Vue 的基础大家可以在官网的【起步】去学习,本系列文章主要针对实例项目应用一、Vue 的安装与使用1.在线引用:<!-- 直接引用 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">&...原创 2018-11-07 12:25:18 · 13787 阅读 · 0 评论