精华内容
下载资源
问答
  • 后端程序员学习vue

    2020-09-18 22:50:58
    vue基本语法学习 一:概述 1. vue是什么? 2. 基本的指令有哪些? 3. 指令的修饰符有哪些? 4. 什么是事件? 5. 事件修饰符是什么? 6. 如何自定义指令? 7. 对象的生命周期是什么? 8. 局部过滤器和全局过滤器是...

    vue基本语法学习

    一:概述

    1. vue是什么?
    2. 基本的指令有哪些?
    3. 指令的修饰符有哪些?
    4. 什么是事件?
    5. 事件修饰符是什么?
    6. 如何自定义指令?
    7. 对象的生命周期是什么?
    8. 局部过滤器和全局过滤器是如何定义的?
    9. 局部组件和全局组件是如何定义的?
    10. 组件是如何值是如何传递的?
    11. 如何调用接口?
    12. 什么是路由?
    13. 开发中如何实现路由?
    14. 什么是模块化?
    15. webpack是什么?
    16. vue单文件组件如何实现?
    17. vue脚手架如何使用?
    18. Element-UI如何使用?
    

    二:vue是什么

    vue是一个前端框架。html和数据、方法隔离。
    

    2.1:vue入门程序

    在使用vue时候,要先导入vue包。
    //src="../utils/vue.js"代表vue相对路径
    <script type="text/javascript" src="../utils/vue.js"></script>
    
    <body>
        <!-- 页面表现层 -->
        <div id="first">
            <div>{{ msg }}</div>
            <div>{{ 1 + 2 }}</div>
            <div>{{ msg  + "-------------" + 123}}</div>
        </div>
    
        <!-- 导入vue包 -->
        <script type="text/javascript" src="../utils/vue.js"></script>
        <script>
            // 数据和数据处理
            var vm = new Vue({
            	//id为first的标签
                el: "#first",
                //为<div id="first">标签中数据
                data: {
                    msg: '学习前端知识太难了'
                }
            });
        </script>
    </body>  
    

    在这里插入图片描述

    2.2:v-text、v-html、v-pre、v-once、v-on、v-bind、v-model

    1. v-text、v-html、{{}}(取值标签)
    <html>
    
    <body>
    
        <div id="app">
    
            <div>{{msg1}}</div>
            <div v-text="msg1"></div>
            <div v-html="msg2"></div>
        </div>
    </body>
    <script type="text/javascript" src="../utils/vue.js"></script>
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                msg1: "<h1>hello vue</h1>",
                msg2: "<h1>hello vue</h1>",
                msg3: "<h1>hello vue</h1>"
            }
        });
    </script>
    
    </html>
    

    在这里插入图片描述
    2. v-model(取值标签)

    <html>
    
    <body>
    
        <div id="app">
            <div>{{msg1}}</div>
            <input type="text" v-model="msg1">
        </div>
    </body>
    <script type="text/javascript" src="../utils/vue.js"></script>
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                msg1:"1111"
            }
        });
    </script>
    
    </html>
    

    在这里插入图片描述
    3. v-pre(修饰标签)
    //跳过编译,直接显示原始内容。

    <html>
    
    <body>
    
        <div id="app">
            <div v-pre>{{msg1}}</div>
        </div>
    </body>
    <script type="text/javascript" src="../utils/vue.js"></script>
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                msg1:"1111"
            }
        });
    </script>
    
    </html>
    

    在这里插入图片描述

    忙于新的任务,估计得等段时间学习了。

    展开全文
  • 学习Vue的第一天 觉得身为后端程序员,以后必不可免都需要接触到前端,后端程序员至少也需要具备一种数据交互的手段,所以从今天开始,学习Vue来弥补短板 ...

    学习Vue的第一天

    觉得身为后端程序员,以后必不可免都需要接触到前端,后端程序员至少也需要具备一种数据交互的手段,所以从今天开始,学习Vue来弥补短板

    标签 效果
    v-cloak 在文本标签中使用 v-cloak 能够解决插值表达式闪烁的问题
    v-text=“msg” 默认使用v-text没有闪烁问题,但是会覆盖标签中的内容
    v-html=“msg” 与text一样,但是text无法编译内容中的标签,html可以
    v-bind:title=“msg1” 是Vue提供的用于绑定属性的指令,v-bind中可以书写合法的JS表达式
    :title =“msg1” 与v-bind:title是同样的效果
    v-on=“msg” 事件绑定机制

    Vue的使用

    <body>
    	<div id="app">
    		<p v-cloak>{{msg}}</p>
    		<p v-text="msg"></p>
    		<p v-html="msg1"></p>
    		<input type="button" value="按钮" v-bind:title="msg +'123'"></input>
    		<input type="button" value="按钮" v-on:click="show"></input>
    	</div>
    	<script src="vue.js"></script>
    	<script>
    		var vm = new Vue({
    			el:"#app"//某个div的id
    			data:{
    				msg:'123',//{{msg}}可以使用插值表达式获得值
    				msg1:'<h4> 222 </h4>',
    				}
    			methods:{//在methods里定义所有可用的方法
    				show:function(){
    					alert('Hello')
    					}
    				}
    	})
    	</script>
    </body>
    
    展开全文
  • 因为自己的项目前端是基于vue的,导致很多同学看不懂前端代码,这边我简单的介绍一下我学习vue的过程,加快后端同学对前端的学习理解。 什么是前后端分离 已经懂前后端分离和RestfulAPI意义的可以跳过这个章节。 早...

    前言

    因为自己的项目前端是基于vue的,导致很多同学看不懂前端代码,这边我简单的介绍一下我学习vue的过程,加快后端同学对前端的学习理解。

    什么是前后端分离

    已经懂前后端分离和RestfulAPI意义的可以跳过这个章节。
    早些时候的web开发是基于servelet的jsp,前后端冗余,那时候的前端和现在含义并不一样,以前的前端更适合叫UI,开发大都还是后端来写。但是这种开发模式有几个问题,一是开发压力很大,既要考虑后端代码,也要考虑前端实现,二是随着小程序,混合app开发,传统的jsp里的接口都要重写,功能明明一样,但是代码却2份,三就是维护问题,jsp项目后期的维护难度很大,四是代码逻辑冗余,需要解耦等。
    各种问题爆发之后,前后端分离刻不容缓,java开发最适合的技术选择就是springboot+vue,这里推荐看下我“Springboot单体架构搭建”系列文章(RestfulAPI在那里有介绍,这里就不介绍了)。Springboot是最适合java后端RestfulAPI开发的框架,目前没有之一。前端的选择则很多,只要支持请求RestfulAPI都行,目前主流是vue,react,angular(老版本angular.js,不推荐学习了)。我选择vue的原因很简单,因为简单易学。
    前后端分离之后,前端代码也可以直接单独部署(通常部署到nginx,建议看下我docker系列文章),如果你前端代码都不能单独运行,你们项目肯定不是分离的了。当然也不是一定要分离,如果你们确实没有前端人员,为了方便也可以选择后端模版引擎,jsp真心已经过时不要再为难自己和后续接手开发了,这里推荐thymleaft和freemarker,开发模式和jsp很像,简单易学。

    前后端分离注意点

    前后端分离之后的权限验证也需要重新设计,这里推荐jwt模式(JSON Web Tokens),简单理解就是登陆请求之后给前端发一个token,之后每次前端请求都要带上token头来证明自己的权限,我在自己“Springboot单体架构搭建”系列文章有实现一个简单的jwt模式。
    不支持ie低版本,比如Vue 不支持 IE8 及以下版本。
    对于爬虫支持不是很好,不太适合做官网首页展示等需要百度爬虫的业务,推荐使用模版引擎。

    学习资料

    官网https://cn.vuejs.org/不多说,先速通一轮官网教程,知道有哪些功能在哪找到,不需要全部记住,开发时候能找到位置就行。
    优秀的开源项目,目前只推荐https://github.com/PanJiaChen/vue-element-admin
    适合的UI框架,web端element-ui(强推),app端iview(暂时不推荐vue直接开发app,react和angular更成熟)

    展开全文
  • 在这篇文章中,我将向你分享我自己是如何学习 Vue 的,以及一些基础的流程,一些 Vue后端渲染模式下的概念进行对比,帮助你快速上手 Vue。 文章内容: 如何认知 SPA 开发; 后端渲染时我们关注什么; Vue 渲染...

    Vue 是近两年极为火热的前端框架。作为一个后端,你是否曾经想要去了解一下 Vue?是否使用过 Vue 来完成自己的 Side Project。

    在这篇文章中,我将向你分享我自己是如何学习 Vue 的,以及一些基础的流程,一些 Vue 和 后端渲染模式下的概念进行对比,帮助你快速上手 Vue。

    文章内容:

    1. 如何认知 SPA 开发;
    2. 后端渲染时我们关注什么;
    3. Vue 渲染时我们关注什么;
    4. Vue 的应用。

    阅读全文: http://gitbook.cn/gitchat/activity/5c75b7bfb7bb4906f36f2c15

    您还可以下载 CSDN 旗下精品原创内容社区 GitChat App ,阅读更多 GitChat 专享技术内容哦。

    FtooAtPSkEJwnW-9xkCLqSTRpBKX

    展开全文
  • 前言vue说来话长话第一次接触的时候是在个人毕设中,前端框架这块当时是bootstrap+vue。当时也没用到复杂的东西,比如webpack和cli这些,这次公司项目中接触到vue,看见一些脚手架之类的东西,认为还是有必要看一下...
  • web前端学习篇——vue Vue CLI(脚手架) Vue CLI(脚手架)是用于快速Vue.js开发的完整系统: 通过交互式项目脚手架@vue/cli。 通过@vue/cli+ 零配置快速原型@vue/cli-service-global。 运行时依赖项(@vue/cli-...
  • vue实现简单购物车 首先上效果 主要实现了删除,全选,全部取消 技术点 对计算属性和侦听器的掌握及@change和watch的区别 上代码: html部分: <div id="app"> <div class="center">购物车</div&...
  • vue是前端的框架,但是因为需要前后端交互,我们还是需要学会简单使用vue的,最基本的当然是安装啦 下载node node是什么?自己百度,这里你只需要知道她需要被用来安装vue就可以了 进入node.js官网下载。注意下载...
  • 我相信很多后端程序员都会有这个感触,我这边想说,你们错了,大错特错啊,正是因为前后端分离,这才需要我们后端程序员掌握的更多,一个只会写接口的程序员注定会被淘汰,未来的社会肯定是一个全栈的社会,没有金刚...
  • 作为一名后端程序员,我们通常专注于后端代码开发,当然也会涉及到一些常用前端脚本语言框架,像jquery(逐步被淘汰),偶尔也会写一些css样式。可以说除了UI之外,我们什么都做。但是这些放在今天是远远不够的,...
  • 作为后端程序员,前端的东西就只会一些基本的HTML,CSS,JavaScript的。突然我要做一个手机上的HTML。需要实现响应式,适应不同分辨率的手机,这个是一个让我头大的问题。在网上找了好久,都说用什么VUE + px2rem...
  • uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架。开发者通过编写 Vue.js 代码,uni-app 将其编译到html5,iOS、Android、微信小程序,支付宝小程序,头条小程序等多个平台,保证其正确运行并达到优秀体验。 ...
  • 其实先学Vue、elementUI,还是先学jQuery,纠结过一阵子。 毕竟,很多人都说jQuery过时了。 jQuery能做到的,Vue都可以做到。 但是,Spring全家桶提供了非常好的开发生态,如果不是非常大的大型项目,个人感觉...
  • 公司经常会接到各种前端h5,安卓,IOS,小程序开发的工作,开发的同事前端这块相对...uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架。开发者通过编写 Vue.js 代码,uni-app 将其编译到html5,iOS、Android、...
  • Vue入门学习---01

    2020-05-09 15:59:32
    Vue.js 学习是很有必要的,毕竟大部分公司是做不到前后端分离开发的,后端程序员打打前端的杂活是常见的。这里记录自己学习vue的知识。这里只记录如何使用,不探索原理。 vue的双向绑定 双向绑定就是你改变data中...
  • 前端:vue+bpmn-js实现activiti的流程设计器,后端Springboot+Activiti开发工作流前端:vue + bpmn-js项目,实现activiti设计器, 后端: springboot + activiti鉴于广大程序员们开发设计器苦不堪言以及后端不知道...
  • java程序员如何使用CDN的方式写Vue

    千次阅读 2020-06-28 14:06:10
    虽然现在前后端分离已成大趋势,java后端就不用写页面了,但是偶尔自己写个小项目也是需要自己写前端页面的。不分离的时候页面写在templates或者static文件夹下,使用npm的方式就显得有点麻烦了,那么我们就用CDN...
  • vue开发环境搭建

    千次阅读 2018-12-06 20:37:48
    作为一个后端程序员,但是又想搭建网站.不依靠别人,那只得 自己点前端. 除了常用的bootstrap之外还想一样,物色几样 如 easyUI , angular.Js,React.js,VUE 等之后,还是选中了 由中国人 开发的 VUE 不但火而且 ...
  • 作为一名后端程序员刚刚学习前端再idea里面启动项目失败了启动命令是npm run dev,但是都配置好的,如下: 然后问了一下专业前端,他教我看配置文件package.json文件里面的配置: 然后这个配置文件的意思是启动...
  • 后端数据,只要调用相应的页面就可以调取,在实际开发中,这些后台数据是需要后端程序员和你共同讨论制作的。我们现在只做前端,数据大家只要会调用即可。 Axios是一个基于Promise(ES6中用于处理异步的)的HTTP库...
  • 但是前端百花齐放,隔个几年就弄出个新框架,早起jQuery还火的很,vue.js出来后,前端程序员改用vue了,jQuery就被前端慢慢抛弃了。所以保持学习很重要。 然而程序员日常的工作时间比较忙碌,有很多公司经常加班,...
  • vuedemo1-4

    2018-05-21 20:45:00
    这节课时技术胖已经为大家准备好了后端数据,你们只要调用相应的页面就可以调取,在实际开发中,这些后台数据是需要后端程序员和你共同讨论制作的。我们现在只做前端,数据大家只要会调用即可。  安装Axios  ...
  • 作为后端转前端程序员,一直都不会Vue 只会用jQuery,说来惭愧,最近项目写完了 抽空学习了Vue,大爱!把最近的学习总结一下 。 v-cloak ----解决页面刷新 显示插值 [v-cloak]{ display: none; } <div id="app...
  • 后端数据,只要调用相应的页面就可以调取,在实际开发中,这些后台数据是需要后端程序员和你共同讨论制作的。我们现在只做前端,数据大家只要会调用即可。 安装Axios 我们直接使用npm install来进行安装。 cnpm ...
  •  Vue、React、Angular,当今前端界的三驾马车,作为传统的后端程序员,前端再也不是我们想的那种切切图就可以了,第一次接触的话,先了解了解一些基础的概念。  学习系列目录地址:...
  • 今天来晚辣,给公司做了一个小项目,一个瀑布流+动态视频控制的DEMO,有需要的可以联系我,公司的项目就不对外展示了(一个后端程序员真的要干前端了哈哈哈)。 书接上文,昨天正式的开始了Vue的代码的学习,简单的...
  • 这篇文章主要为大家详细介绍了Vue中Axios从...后端数据,只要调用相应的页面就可以调取,在实际开发中,这些后台数据是需要后端程序员和你共同讨论制作的。我们现在只做前端,数据大家只要会调用即可。安装Axios我...
  • React和Vue对比

    2020-10-09 11:32:26
    1、Vue上手更简单,特别是从dom和jquery时代过来的程序员,或者习惯模板语言的后端开发,更容易接受Vue。 2、Vue从设计上讲,跟趋向于简化使用,就是说Vue从骨子里面就是想用起来简单,但React更多的是为大型工程...

空空如也

空空如也

1 2 3 4
收藏数 78
精华内容 31
关键字:

后端程序员学vue

vue 订阅