来上海快一年了,一直在东钿金融工作着,这一年来主要负责公司前期的房产评估微信平台,公司IT部也是刚刚成立,成立IT部门不仅仅只是维护房产评估微信,而是要做一个互金理财平台。于是我一年来的主要工作是负责互金理财平台的前端工作,主要分三大块,后台,PC端,移动端(微信端)。这些工作在3月份基本已经完成总体开发,进入稳定。根据公司的要求是要有一个app。于是老大就让我学习用vuejs 写一套移动端。所以就引出了今天的主题vuejs学习旅程。

一,首先从简单的开始,花了一天的时间写一个简单菜单隐藏显示的功能 ,废话不多少,晒图晒代码

效果图:

就是这种隐藏显示

html:

vuejs:

css:

思路:vuejs 特点是数据双向绑定,所以这里用的是showmenu_is 这个值控制菜单是否显示。而且用了template标签v-if判断showmenu_is 。为true的时候就显示,否则不显示,然后再给点击的元素上面直接绑-on:click=menu()。写了一个menu方法就是点击来回切换true or false.相比jquery 是要简单挺多的。关闭的时候也可以直接使用menu这个方法。一开始使用vuejs不知从何下手。理解了原理 ,使用起来真的是比jquery方便多了。好了,这一节就说这么多。下一节说下vuejs 里面的ajax功能。

vuejs 学习旅程一的更多相关文章

  1. vuejs 学习旅程之 vue-resource

    如上图,所有的数据是从php获取过来的.所以就引出了vuejs 与php通信之说.百度了一下需要使用到一个vue插件 就是今天的主题 vuejs 学习旅程之 vue-resource vue-reso ...

  2. vuejs学习网站推荐

    vuejs学习网站推荐 https://coligo.io/

  3. vuejs学习——vue+vuex+vue-router项目搭建(三)

    前言 vuejs学习——vue+vuex+vue-router项目搭建(一) vuejs学习——vue+vuex+vue-router项目搭建(二) 为什么用vuex:组件之间的作用域独立,而组件之间 ...

  4. vuejs学习——vue+vuex+vue-router项目搭建(二)

    前言 最近比较忙,所有第二章发布晚了,不好意思各位. vuejs学习——vue+vuex+vue-router项目搭建(一) 中我们搭建好了vue项目,我相信大家已经体验了vue其中的奥妙了,接下来我 ...

  5. VueJs 学习笔记

    VueJs学习笔记 参考资料:https://cn.vuejs.org/ 特效库:TweenJS(补间动画库)  VelocityJS(轻量级JS动画库) Animate.css(CSS预设动画库) ...

  6. vuejs学习之 项目打包之后的首屏加载优化

    vuejs学习之 项目打包之后的首屏加载优化 一:使用CDN资源 我们在打包时,会将package.json里,dependencies对象里插件打包起来,我们可以将其中的一些使用cdn的方式加载,例 ...

  7. redis学习教程一《Redis的安装和配置》

    redis学习教程一<Redis的安装和配置> Redis的优点 以下是Redis的一些优点. 异常快 - Redis非常快,每秒可执行大约110000次的设置(SET)操作,每秒大约可执 ...

  8. VueJS学习资料大全

    参考:http://www.worktle.com/articles/2467/ 文档&社区 Vue.js官方网站(中文) :http://cn.vuejs.org/ Vue论坛:http:/ ...

  9. Vuejs学习笔记1

    首次写vue可能会出现:[Vue warn]: Cannot find element: #app 这是因为你的js在html页面头部引入的原因,自定义js文件要最后引入,因为要先有元素id,vue才 ...

随机推荐

  1. loj 6089 小 Y 的背包计数问题——分类进行的背包

    题目:https://loj.ac/problem/6089 直接多重背包,加上分剩余类的前缀和还是n^2的. 但可发现当体积>sqrt(n)时,个数的限制形同虚设,且最多有sqrt(n)个物品 ...

  2. Python创建删除文件

    Python代码如下: import os directory = "E:\\学习日志\\" os.chdir(directory) # 改变当前工作目录 cwd = os.get ...

  3. web攻击之零:WEB攻击及防御技术汇总

    一.XSS攻击 [介绍] xss攻击是跨站脚本攻击,例如在表单中提交含有可执行的javascript的内容文本,如果服务器端没有过滤或转义这些脚本,而这些脚本由通过内容的形式发布到了页面上,这个时候如 ...

  4. 'xxx' declared `static' but never defined

    'xxx' declared `static' but never defined [问题描述] uart.c文件中有函数read_sample的实现: [plain] view plain copy ...

  5. Jsp介绍(1)

    JSP(Java Server Pages)是运行在服务端的语言是一种动态网页开发技术它使用JSP标签在HTML网页中插入Java代码.标签通常以<%开头以%>结束.是一种使软件开发者可以 ...

  6. Oracle&nbsp;11gr2的完全卸载

    Oracle 11gr2的完全卸载方式与前些版本有了改变,运行D:\app\Administrator\product\11.2.0\dbhome_1\deinstall的deinstall.bat批 ...

  7. swfupload原理总结

    1.引入js(js内动态添加上传的文件并提交表单) 2.后台处理(将图片保存) 3.调用另一个js修改前台图片的地址(改为新的图片地址)

  8. Linux下使用sendEmail发送带附件的邮件(转载)

    转载:http://www.ttlsa.com/linux/use-sendemail-send-file/ sendEmail是一个轻量级,命令行的SMTP邮件客户端.如果你需要使用命令行发送邮件, ...

  9. css hack汇总

    注意点: 网上很多资料中常常把!important也作为一个hack手段,其实这是一个误区.!important常常被我们用来更改样式,而不是兼容hack.造成这个误区的原因是IE6在某些情况下不主动 ...

  10. windows和Dos常见命令总结

    linux最常见命令 (1) pwd命令pwd (即print working directory,打印工作路径) 命令的功能是显示当前的工作路径.如现在是在“/home/CAI”目录下,则可以用此命 ...