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 · 20046 阅读 · 6 评论 -
CSS3 实现 div 上下滑入滑出效果
CSS3 实现 div 上下滑入滑出效果本篇内容：1，首先需要用的是 CSS3 的 target 选择器，配合a标签指定id选择器切换目标元素，用于选取当前活动的目标元素。 （当然也可以不用 a 便签，页面加载的时候自动滑动）2，CSS3 的 transition 动画，这里不做详细介绍动图展示：滑动效果源代码<!DOCTYPE html><html lang="...原创 2019-03-05 23:17:01 · 18809 阅读 · 0 评论 -
Vue 框架-12-Vue 项目的详细开发流程
Vue 框架-12-Vue 项目的详细开发流程首先，如果你还不了解 Vue 脚手架怎么搭建？默认的环境中有哪些文件？文件大概是什么作用？那么，您要先查看之前的文章才有助于你理解本篇文章：Vue 框架-10-搭建脚手架 CLI + 批处理快捷启动 Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置（一）Vue 组件及环境依赖介绍大家打开 Vue 脚手架的环境...原创 2018-11-16 17:51:14 · 2051 阅读 · 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 · 1484 阅读 · 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 · 2199 阅读 · 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 · 2258 阅读 · 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 · 2275 阅读 · 0 评论 -
Vue 框架-09-初识组件的应用
Vue 框架-09-初识组件的应用今天的第一个小实例，初步使用组件：在 app.js 中定义模板组件，在 html 文件中使用自定义标签来显示 js 文件中定义的 html 代码块比如说，下面定义一个模板，提示我的 csdn 连接，可以这样使用：源代码 app.js 文件：//定义模板，因为在 html 中对应一个自定义标签模板，所以内容也只能是一对标签Vue.component("t...原创 2018-11-15 19:57:59 · 844 阅读 · 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 · 3292 阅读 · 0 评论 -
Vue 框架-05-动态绑定 css 样式
Vue 框架-05-动态绑定 css 样式今天的小实例是关于 Vue 框架动态绑定 css 样式，这也是非常常用的一个部分首先说一下 动态绑定，相对的大家都知道静态绑定，静态绑定的话，直接加 class=“”就可以了，使用 Vue 呢之前也介绍过一个 v-bing:class="{{redClass:true}}" ，也可以实现绑定，但都不是动态绑定，动态绑定肯定是根据用户的某个操作实现动态的...原创 2018-11-13 23:45:13 · 9645 阅读 · 2 评论 -
Vue 框架-04-计算属性 computed
Vue 框架-04-计算属性计算属性是什么？大家可以去看官网解释：计算属性和侦听器今天的第一个小实例：为啥先放折磨一个实例，之前数据绑定的就已经可以实现了，看起来那么简单，就是为了告诉大家，当点击第一个按钮【Add to A】的时候，Age + A = 这个方法执行了，大家可以看得到实际呢，下面的两个方法都会刷新，虽然 Age + B = 没有效果，是因为没有修改数据，后面会详细说明...原创 2018-11-13 22:39:23 · 1538 阅读 · 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 · 924 阅读 · 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 · 14845 阅读 · 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 · 2562 阅读 · 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 · 13840 阅读 · 0 评论