14--Rails的ActiveView2

我们这节课将在ActiveView基础上完善微博功能的前端代码:

这节课会讲rails中两个最常用的前端内置方法link_to和form_for

link_to就是生成超链接,也就是相当于html的<a>这个超链接标签。

使用格式:link_to "链接显示的文字" options = {}, html_options = {}

基本格式就是这样,如果我们不写明提交方式,会默认使用http的get方法来进行请求

那微博的show页面来说

<%=
link_to ‘Edit‘, edit_post_path(@post) %>
|

就是点击Edit(链接名可以随便写不一定Edit)这个超链接,edit_post_path(@post)就是链接跳转的地址,(这里的地址也是使用rails的一个前端方法来生成的,这个其实我们前前面讲路由的时候提到过,怎么生成一个edit的路由以及参数什么意思,这个看一下前面路由部分就知道。这就是一个超链接最基本的用法,没有写出提交方法,所以默认使用get方法进行网页请求。也就是点击Edit,使用get方法请求edit_post_path(@post)这个网页。

第14行一样,也就是使用get方法请求posts_path这个网页。

那么我们来看一下这rails将这两个超链接前端模板解析后的html代码是什么。

查看网页源代码,看出解析后市26、27这两行

点击Edit,可以看到跳转的网页路由就是跟上面一样

点击Back,可以看到跳转的网页路由就是跟上面一样

我们也可以去官方文档查看link_to的使用方法:

浏览器输入api.rubyonrails.org进入官方文档页面

左上角输入直接回车或点击

如下就给出详细的说明

还给出了使用的例子

link_to "Profile", profile_path(@profile)这是视图页面使用的前端模板代码
# => <a href="/profiles/1">Profile</a>  这是使用结果,也就是对应结果的网页源代码
												

?

我们的使用:

就是模仿上面使用,只不过加上<%= %>包围起来

对应网页源代码如下

查看并使用官方API文档是基本技能。以后rails学习中看到别人使用的函数不懂什么意思,就可以到官方文档查看该函数,研究一下文档你就知道该函数的作用和使用方法了。

?

接下来讲另一个前端方法,它用得很多,本质上也是跟link_to一样被解析成html代码。其实我们在之前写注册表单和登陆表单的时候就用过了,如下第4行到第10行就是form_for和它的各个子属性的使用(后面的f就是form_for对象):

这样我们就知道了form_for最重要的一个作用就是去生成一个前端页面的表单供用户去填写信息和提交(表单不就是用来向服务器提供数据的嘛),解析后就是html的form表单标签。

在表单方法中提供了两种不同的方法类型,第一种就是能够对应模型组件的创建、修改等等,也就是我们上面登陆页面的form_for能够影响模型的创建或修改等等,好处就是能够通过你传入的模型变量自动将变量的初始值代入表单,用截图解释就是:

我们输入路由http://localhost:3000/posts/2/edit时,发现表单中自动帮我们填入了Content的内容(也就是自动将变量的初始值代入表单的意思)。

接下来我们看一下注册表单的form_for的使用:

与登陆的参数是session和路径不同,注册页面的form_for(@user)里的@user就是与模型对应的变量对象,我们通过给form_for传入这样的对象,form_for就能自动访问到这个变量的属性并且进行表单的初始。

与这个form_for对应的还有form_tag的方法,它是与form_for对应,与form_for最大的区别就是它不需要传入类似于@user这样的一个变量对象或者叫模型对象(我们这里说的变量就是模型变量),它就是一个单纯的表单生成方法。form_tag更灵活,但是提交什么样的变量,用什么方法提交等等都需要自己去配置比较复杂。

form_for其实就是对form_tag的一个高级封装,(它的底层代码就是对form_tag的封装)

这两个方法的选择原则:

如果你的表单是为了修改或者创建一个与模型对应的变量的话,你最好就使用form_for这个方法,因为它很方便,很强大。

如果你的表单只是为了向服务器提交一些数据,比如我们搜索只是向服务器提交搜索关键词,而关键词这种没有与之对应的模型对象那么就选择form_tag.

这两个方法想进一步研究就去看官方API文档就可以。

?

最后讲解一下前端的局部视图的基本概念,局部视图其实就是rails对前端视图的一种组织方式,比如不同视图有公共的页头页尾这类,通过局部视图,页面会更加简洁高效。

前面我们在写视图代码的时候直接就开始写body部分代码,那么就有这么一个问题:每个页面都是有头有尾的,我们怎么直接写body部分的内容就能访问该视图页面呢?这个就是局部视图的强大之处了,我们写的那么多视图页面的页头页尾(header标签这类)都由布局文件夹下的application.html.erb帮我们完成了,它就是利用了rails中的局部视图,将那么多前端文件的共同页头页尾都统一写到这一个文件中

如下就是css样式和javascript的引用,都是通过rails的前端的方法完成的,这个可以像前面一样去看文档。

因为这些相同的代码放在统一的文件中就很方便了,那么不同的内容部分就写在不同的局部视图文件里。我们之前写的那么多页面文件就是局部视图文件,它对应<%= yield %>,rails在解析前端页面的时候就是其他都一样不同页面就是把<%= yield %>替换为我们编写的不同局部视图文件就可以了。

一句话就是:我们之前写的那些就是局部视图文件,我们打开直接写body部分的内容就行了。

?

时间: 2024-10-08 16:28:47

14--Rails的ActiveView2的相关文章

ubuntu 14.04中安装 ruby on rails 环境(填坑版) 呕血推荐

环境:在win7 上Vmware虚拟机环境中安装的ubuntu 14.04 开发相关: ruby 2.2.0 rails 4.2.0 sublime text 3 本文说明:所有的命令均在$ 之后,若$前边带有信息,只是为了方便你理解和与自己对照. 安装过程中由于这样那样的原因,产生许多坑,所谓坑是对初学者来说,大牛们飘过吧. 步骤1.从官网下载ubuntu 14.04 X64 http://124.205.69.136/files/2013000000502943/202.141.176.11

ruby on rails安装(ubuntu 14.04)

安装完windows版的,有人说新手千万不要用windows版的,因为会出现莫名其妙的错误,而且解决问题的方法很少,恩,最近小小的使用了下,还没有什么windows特有不能解决的问题,大概是才刚刚开始.项目用的服务器是ubuntu,所以嘛,还得用linux不是,下面是ubuntu14.04麒麟下的安装方法,使用的是RVM安装,相对简单. ubuntu 14.04 安装 1. 安装依赖: 安装之前要使用sudo apt-get update更新一下源,否则可能会出现如libcurl4-openss

ubuntu 14.04下的rails开发环境

1.首先是安装RVM, $ gpg --keyserver hkp://keys.gnupg.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 $ curl -sSL https://get.rvm.io | bash -s stable $ source ~/.rvm/scripts/rvm echo "ruby_url=https://cache.ruby-china.org/pub/ruby" > ~/.rvm

NVIDIA DIGITS 学习笔记(NVIDIA DIGITS-2.0 + Ubuntu 14.04 + CUDA 7.0 + cuDNN 7.0 + Caffe 0.13.0)

转自:http://blog.csdn.net/enjoyyl/article/details/47397505?from=timeline&isappinstalled=0#10006-weixin-1-52626-6b3bffd01fdde4900130bc5a2751b6d1 NVIDIA DIGITS-2.0 + Ubuntu 14.04 + CUDA 7.0 + cuDNN 7.0 + Caffe 0.13.0环境配置 引言 DIGITS简介 DIGITS特性 资源信息 说明 DIGI

转-基于NodeJS的14款Web框架

基于NodeJS的14款Web框架 2014-10-16 23:28 作者: NodeJSNet 来源: 本站 浏览: 1,399 次阅读 我要评论暂无评论 字号: 大 中 小 摘要: 在几年的时间里,Node.js逐渐发展成一个成熟的开发平台,吸引了许多开发者.有许多大型高流量网站都采用Node.js进行开发,像PayPal,此外,开发人员还可以使用它来开发一些快速移动Web框架. 下面就介绍14款基于Node.js的Web应用框架,大家不... 在几年的时间里,Node.js逐渐发展成一个成

Ubuntu下安装 Ruby, Rails 运行环境

说明: 在安装之前我做了:1.更新软件源,详细指导在这里: 2.更新系统:sudo apt-get update && sudo apt-get upgrade; 3.安装fcitx,安装sogou输入法: 4.打字不方便,禁用触摸板:sh TouchPad.sh off 接着就开始安装了!这里说明一下,后面的可能有几步可能是多余的,怕出错,就没有说去更正简化. 参考资料来自:边晓宇@CSDN 和 ruby-china.org如何快速正确的安装 Ruby, Rails 运行环境 操作系统U

Rails::Application中的一个方法调用

Ruby语言的动态性使得想仅仅通过查找相关API文档来学习Rails是完全不够的,因为API文档只记录了静态代码定义的方法,而Rails中有很多的方法都是在加载时或运行时动态生成的,想要了解这些方法必须要阅读源代码.本文以Rails工程下的config/application.rb文件中的一个方法调用为例,分析方法调用的具体过程. 1. 问题描述 假设Rails工程叫做Sample,那么在config/application.rb中会定义Sample::Application,并可以在其中调用c

Ubuntu 14.04安装redmine

公司要安装项目管理系统,采用redmine,新来的我就来做这个小小的任务了,中途也出过几次问题,搭建redmine,他的依赖包很多,所以我建议用apt装,下面开始吧. 首先升级一下源 apt-get update apt-get upgrade 更新完成 PS:(如果图省事,可以选择LAMP套件安装,此处指mysql和apache此处不用套件安装了 ) 安装apache2和apache2的一个模块 apt-get install apache2 libapache2-mod-passenger

linux下的rbenv和rails安裝

今天是周一,我到新公司的第14天,今天继续linux下ruby和rails环境变量的配置. 首先碰到的问题是 主要看ubuntu下安装rbenv,ruby,rails开发环境, http://blog.chinaunix.net/uid-7915607-id-3961698.html    参考rbenv+ruby-build管理ruby http://segmentfault.com/a/1190000000366488 后面碰到的问题是集中在下面这3个问题之上: Could not find

Capistrano+Nginx+Unicorn 自动部署Rails

配置你的服务器 你需要在你的服务器上安装Ruby的环境,你可以使用RVM或者是rbenv. 上传到github 这步需要将你的应用上传到github,在你的github上创建新的repository,然后在你本机代码位置执行下面的命令,初始化git仓库. git init git add . git commit -m"<message>" git remote add origin [email protected]:<username>/<git re