• rails手脚架(scaffold)功能


    scaffold是一个高速开发rails应用的代码框架。能够使用一条命令实现CRUD操作。

    1: 创建一个应用

     rails new scaffoldapp
     cd scaffoldapp
     rails s

    在浏览器中打开http://localhost:3000/

    2: 创建一个名为blog的Scaffold

    使用rails的scaffold创建模版。在此基础上进行添加、删除、改动、查询(CRUD)操作.

    rails g scaffold blog title:string content:text picture:string 
    

    数据库迁移:

    rake db:migrate

    浏览器中訪问:http://localhost:3000/blogs
    这里写图片描写叙述

    3:加入图片上传功能

    能够參考我的上一篇博客rails中使用carrierwave上传图片
    更新Gemfile

    gem 'carrierwave'
    bundle install
    rails generate uploader Picture

    改动/app/models/blog.rb,挂载picture属性

    mount_uploader :picture, PictureUploader

    打开 app/views/ideas/_form.html.erb ,找到这一行:

    <%= f.text_field :picture %>

    将它改成:

    <%= f.file_field :picture %>

    并将这一行:

    <%= form_for(@blog) do |f| %>

    改成:

    <%= form_for(@blog,:html => {:multipart => true}) do |f| %>

    打开 app/views/ideas/show.html.erb 并将

    <%= @blog.picture %>

    改为

    <%= image_tag(@blog.picture_url, :width => 300) if @blog.picture.present?

    %>

    4.改动样式

    打开/app/controllers/blogs_controller.rb
    新建一个方法

     def list
         @blogs = Blog.all
      end

    在/app/views/blogs/文件夹下新建list.html.erb

    <div class="bgheader">
        <h1>My Blog</h1>
    </div>
    
    <% @blogs.each do |blog| %>
          <h2 class="bgtitle"><%=link_to blog.title,blog %></h2>
          <p><%= blog.content[0,150]%></p>
    
    <% end %>

    改动/config/routes.rb,加入:

    root 'blogs#list'

    添加/app/assets/stylesheets/application.css

    body{
    
        padding: 0px;
        margin:0px;
        width:1000px;
        margin:0 auto;
     }
    .bgheader{
        margin-top: -20px;
        height: 80px;
        background-color: #E9F2E8;
    }
    .bgheader h1{
        color: #238A2A;
        padding-top: 15px;
        padding-left: 20px;
    }
    
    .bgtitle a:link,.bgtitle a:visited{
        color: #0080FF;
    }
    #blog_title{
        width:300px;
        height:20px;
    }
    #blog_content{
        width:480px;
        height:300px;
    }
    .bgcontainer{
        width:600px;
    }
    .bgshow{
        width:800px;
    }

    改动/app/views/blogs/show.html.erb

    <div class="bgshow">
    <p id="notice"><%= notice %></p>
    
    <h2>
      <%= @blog.title %>
    </h2>
      <%= @blog.content %>
    <hr>
      <%= image_tag(@blog.picture_url, :width => 300) if @blog.picture.present? %>
    <hr>
    <%= link_to 'Edit', edit_blog_path(@blog) %> |
    <%= link_to 'Back', blogs_path %>
    </div>

    效果

    首页
    这里写图片描写叙述
    详情页
    这里写图片描写叙述

  • 相关阅读:
    Promise是如何实现异步编程的?
    js 检测元素是否被覆盖
    antd upload组件结合七牛云上传图片
    webpack原理分析之编写一个打包器
    docker命令构建Java程序镜像,并运行它
    新建mysql docker指定版本
    spring官方文档网址
    rabbitmq用x-delayed-message的exchange特性支持消息延迟消费
    解决Can't open /usr/lib/grub/update-grub_lib
    java8-强大的Stream API
  • 原文地址:https://www.cnblogs.com/yfceshi/p/7262032.html
Copyright © 2020-2023  润新知