vue入门学习记录
vue入门学习开始,个人学习记录
gansilian
程序员路程长远而漫长,我努力跟着队伍前进,却发现自己被甩在队尾一大截
展开
-
Mint-ui popup 使用 (指定位置)
Mintui Popup 使用Mint -ui 网址http://mint-ui.github.io/#!/zh-cn示例:Popup弹出框,可自定义内容。引入import { Popup } from ‘mint-ui’;Vue.component(Popup.name, Popup);例子position 属性指定了 popup 的位置。比如,position 为 ‘bottom’ 时,popup 会从屏幕下方移入,并最终固定在屏幕下方。移入/移出的动效会根据 position 的原创 2020-07-06 09:14:58 · 1664 阅读 · 0 评论 -
VUE的使用,学会这些就足够了!!!(一)
VUE的使用,学会这些就足够了!!!(一) ...转载 2020-06-04 17:30:21 · 131 阅读 · 0 评论 -
vue组件添加事件@click.native
vue组件添加事件@click.native1,给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件2,等同于在子组件中: 子组件内部处理click事件然后向外发送click事件:$emit(“click”.fn)1<Item @click.native = “shijian()”>...转载 2020-05-20 14:08:19 · 298 阅读 · 0 评论 -
vue props 传值
一、子组件需要做的子组件要显式地用 props 选项声明它期待获得的数据props:[data]然后在组件内使用data二、父组件需要做的这个时候需要区分静态传值和静态传值静态在父组件使用子组件标签时 <tem data="haha"></tem>这个时候静态传值就完成了动态在父组件使用子组件标签时<tem v-bind: data="myData"></tem>data(){ return{ myData:"hah转载 2020-05-18 10:04:17 · 4774 阅读 · 0 评论 -
Vue.js 之(mint-ui)控件mt-header 的title传值
一般开发时都会做一个header.vue 存放每个页面模板的 页头部位刚刚接触到 mint-ui的 mt-header所有的东西都是从头开始,一个mt-header 的 title 动态传值就给难住了,(示例给的是静态赋值)想改成动态,知道是 :title 具体怎么写却不会,最后终于解决。首先是在header.vue 中的代码 ,这里设置为动态...原创 2020-05-14 17:25:00 · 1953 阅读 · 0 评论 -
Mint UI跳转新页面
Mint UI跳转新页面 本文链接: https://blog.csdn.net/weixin_44763569/article/details/90408847 ...转载 2020-05-12 17:03:50 · 491 阅读 · 0 评论 -
v-model的基本使用
v-model的基本使用 例一:<template> <div> <h3>v-model</h3> <div> <input type="text" value="默认值" v-model="firstipt" /> <p>{{ firstipt }}</p转载 2020-05-11 16:53:49 · 198 阅读 · 0 评论 -
(笔记整理) 简单理解Vue中的nextTick -13(2)
https://www.jianshu.com/p/a7550c0e164fVue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下。其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick。一、示例先来一个示例了解下关于Vue中的DOM更新以及nextTick的作用。模板 {{msg}} Messag...转载 2020-04-30 16:29:40 · 135 阅读 · 0 评论 -
(笔记整理) vue中watch的详细用法 -(13)
https://www.cnblogs.com/shiningly/p/9471067.htmlvue中watch的详细用法在vue中,使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法:<input type="text" v-model="cityName"/>new Vue({ el: '#root', data: {...转载 2020-04-30 09:55:02 · 97 阅读 · 0 评论 -
(笔记整理)Vue的组件为什么要export default
https://www.cnblogs.com/blog-cxj2017522/p/8562536.html Vue的组件为什么要export default Vue 的模块机制 Vue 是通过 webpack 实现的模块化,因此可以使用 import 来引...转载 2020-04-21 16:12:20 · 236 阅读 · 0 评论 -
(笔记整理)Mint UI入门系列教程
https://www.jianshu.com/p/61a04dc86d9aMint UI入门系列教程12019.05.03 08:31:42字数 1,947阅读 23,687Vue移动端框架Mint UI教程-搭建环境引入框架(一)官网:https://mint-ui.github.io/#!/zh-cnGithub: https://github.com/ElemeFE/mint-...转载 2020-04-21 13:30:56 · 433 阅读 · 0 评论 -
Vue中的this.$store.state.xx.xx
Vue中的this.$store.state.xx.xx ...转载 2020-04-20 13:58:57 · 493 阅读 · 1 评论 -
(笔记整理)vue项目mint-ui组件按需引入(12)
https://www.jianshu.com/p/efb58263af7avue项目mint-ui组件按需引入 大家有时候会用到mint-ui框架,但是有时候只需要一部分,全部引入又太占资源,所以按需引入组件的mint-ui就非常人性化。1.官方文档的注意事项 按照 Mint-ui 的官方文档,...转载 2020-04-16 15:37:35 · 122 阅读 · 0 评论 -
(笔记整理)VueJs开发环境的搭建和讲解index.html如何被渲染(12)
https://blog.csdn.net/yudiandemingzi/article/details/80247137 VueJs(2)---VueJs开发环境的搭建和讲解index.html如何被渲染 ...转载 2020-04-16 09:47:20 · 229 阅读 · 0 评论 -
(笔记整理)公司vue平台用到redis,相关概念与登录(11)
Redis(全称:Remote Dictionary Server 远程字典服务)是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库,并提供多种语言的API。从2010年3月15日起,Redis的开发工作由VMware主持。从2013年5月开始,Redis的开发由Pivotal赞助。redis是一个key-value存储系统。和Memcac...转载 2020-04-15 14:58:19 · 2523 阅读 · 0 评论 -
(笔记整理)vue.js 的使用工具之VsCode使用教程(9)
调试页面1/2/打开vue项目后配置选择chrome调试方式后,跳出lauch.json 进行配置三、新建一个html直接采用Chrome来进行调试的实现方案3.1 首先安装,如下图。方法已经特别具体,再此不再赘述。3.2 在自己的html工程目录下面点击f5,或者在左侧选择调试按钮但是直接打开的chrome将会出现如下错误3.3.解决以上问题首先在弹出来的la...转载 2020-04-10 17:29:24 · 208 阅读 · 0 评论 -
(笔记整理)与vue相关的开发工具vscode配置(10)
https://www.cnblogs.com/clwydjgs/p/10078065.htmlVisual Studio Code(VScode )github地址 :https://github.com/Microsoft/vscode二.怎么安装插件? 写在前面 在前端开发中,有一个非常好用的工具,Visual Studio Code,简称VS code。 都不...转载 2020-04-10 16:49:15 · 161 阅读 · 0 评论 -
(笔记整理)与vue相关的问题总结(8)-2
webpack和vue.js的关系https://yq.aliyun.com/articles/619743https://blog.csdn.net/qq_16559905/article/details/78551719性能优化 - 查看 webpack 打包后所有的依赖关系(webpack 可视化工具)webpack优化 : https://segmentfault.com/a/11...转载 2020-04-10 15:59:17 · 104 阅读 · 0 评论 -
(笔记整理)与vue相关的问题总结(8)-1
一、vue之node.js的简单介绍https://www.cnblogs.com/haiyan123/p/8371283.html一、什么是node.js?它是可以运行JavaScript的服务平台,可以吧它当做一门后端程序,只是它的开发语言是JavaScript二、安装1、node.js的特性:非阻塞IO模型时间驱动2、运用的场景:高并发低业务实时场景聊天...转载 2020-04-10 15:02:59 · 188 阅读 · 0 评论 -
(笔记整理)学习vue前的准备工作-es6(7)
(笔记整理)学习vue前的准备工作-es6(7)参考链接https://www.cnblogs.com/majj/p/9041582.html起步:1.扎实的HTML/CSS/Javascript基本功,这是前置条件。2.不要用任何的构建项目工具,只用最简单的另外在这里大家补充点ES6的语法。什么是ECMAScript,以及es6的诞生?1997年 ECMAScript 1.0 诞生...转载 2020-04-10 13:32:52 · 321 阅读 · 0 评论 -
(笔记整理)vue-cli 脚手架及打包(6)
vue-cli是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目,GitHub地址是:https://github.com/vuejs/vue-cli一、安装vue-cli: 直接全局安装 vue-cli: npm install -g vue-cli但是这种安装方式比较慢,推荐使用国内镜像来安装,所以我们先设置 cnpm:npm inst...转载 2020-03-26 22:06:11 · 1029 阅读 · 0 评论 -
(笔记整理)第一个vue创建-步骤总结(5)
1、node.jsVue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装node.js。 (安装步骤见前几节笔记)1、安装node.js安装完毕之后,在命令行下验证是否安装成功:2、进入命令行开始-运行- cmd3、查询node版本输入 npm -v,显示版本信息就表示node.js安装成功。4、 cnpm安装完...原创 2020-03-26 16:45:56 · 92 阅读 · 0 评论 -
(笔记整理)React、Angular、Vue.js:三者完整的比较指南_(vue.js的特色)(4)
React、Angular、Vue.js:三者完整的比较指南链接地址谈到框架,这些天你的选择差不多。在本文中,我们希望能够更轻松地做出决定。选择技术堆栈有时会变成一项繁琐的任务,因为您需要考虑每个因素,包括预算,时间,应用程序大小,最终用户,项目目标和资源。无论您是初学者,开发人员,自由职业者还是项目架构师形成策略,明智地决定每个框架的优缺点都是明智的。因此,这篇文章不会帮助您选择最好的...转载 2020-03-25 15:00:21 · 246 阅读 · 0 评论 -
(笔记整理)web开发工具(node npm Bower webpack)使用介绍-npm(3)
参考路径:一 .npmhttps://www.npmjs.com/ 第三方包搜索https://www.cnblogs.com/john-sr/p/6036652.htmlhttps://www.npmjs.cn/getting-started/what-is-npm/https://www.runoob.com/nodejs/nodejs-npm.html NPM 使用介绍...转载 2020-03-25 12:08:18 · 170 阅读 · 0 评论 -
(笔记整理)Vue.js环境搭建(2)
参考文档链接:一、 Vue的安装及使用快速入门二、Vue.js环境搭建Vue.js环境搭建1,安装Node环境Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装node.js。node.js的官方地址为:https://nodejs.org/en/download/,下载相应版本安装即可。安装完毕之后,在命令行下验证是否安...转载 2020-03-23 21:53:59 · 91 阅读 · 0 评论 -
(笔记整理)Vue入门-概念(1)
Vue.js简介.转载 2020-03-23 16:12:59 · 155 阅读 · 0 评论