主頁 > 前端設計 > Rails5:最近把我的表單改成了嵌套表單,現在需要訪問嵌套中的陣列。如何重寫我的jbuilder?

Rails5:最近把我的表單改成了嵌套表單,現在需要訪問嵌套中的陣列。如何重寫我的jbuilder?

2021-11-09 18:14:20 前端設計

(抱歉,如果這個問題很簡單……我已經在這個問題上呆了幾天了)

所以......我最近改變了我的模型、控制器和部分 _form.html.erb 檔案來實作一個嵌套表單......

現在我的 jbuilder 檔案需要重構,但我對提取嵌套值是個菜鳥......

原始 index.json.jbuilder

json.array! @assignments do |assignment|
 
  date_format = assignment.all_day_event? ? '%Y-%m-%d' : '%Y-%m-%dT%H:%M:%S'
  #binding.pry
  json.description assignment.description <---this used to work before I added my Nested Form
  
  # REQUIRED
  json.id assignment.id
  json.title assignment.roster_title
  json.start assignment.event_date.strftime('%Y-%m-%d') assignment.start_time.strftime('T%H:%M:%S')
  json.end assignment.event_date.strftime('%Y-%m-%d') assignment.end_time.strftime('T%H:%M:%S')
  # REQUIRED end
  shift_id = assignment.volunteer_shift_id.nil? ? assignment.volunteer_task_type_id : assignment.volunteer_shift_id
  json.volunteer_shift_id shift_id
# DATE
  json.date assignment.event_date.strftime('%Y-%m-%d')

# TIME
  json.start_time assignment.start_time.strftime('T%H:%M:%S')
  json.end_time assignment.end_time.strftime('T%H:%M:%S')
  json.color assignment.color unless assignment.color.blank?
#   json.color assignment.skedj_style unless assignment.skedj_style.blank?
  json.allDay assignment.all_day_event? ? true : false

  json.update_url assignment_path(assignment, method: :patch)
  json.edit_url edit_assignment_path(assignment)
end

這是我得到的錯誤...

 Rendering assignments/index.json.jbuilder
  Assignment Load (2.1ms)  SELECT "assignments".* FROM "assignments" INNER JOIN "volunteer_shifts" ON "volunteer_shifts"."id" = "assignments"."volunteer_shift_id" INNER JOIN "volunteer_events" ON "volunteer_events"."id" = "volunteer_shifts"."volunteer_event_id" WHERE ("volunteer_events"."date" BETWEEN $1 AND $2)  [["date", "2021-01-05"], ["date", "2021-01-06"]]
  Rendered assignments/index.json.jbuilder (27.8ms)
Completed 500 Internal Server Error in 48ms (ActiveRecord: 6.3ms)


DEPRECATION WARNING: #original_exception is deprecated. Use #cause instead. (called from real_exception at /home/fonso/.rbenv/versions/2.5.8/lib/ruby/gems/2.5.0/gems/better_errors-0.3.2/lib/better_errors/error_page.rb:82)

NoMethodError - undefined method `volunteer_event' for nil:NilClass:
  app/models/assignment.rb:46:in `description'
  app/views/assignments/index.json.jbuilder:12:in `block in _app_views_assignments_index_json_jbuilder__1085023644391212852_37504860'
  (gem) jbuilder-2.11.2/lib/jbuilder.rb:339:in `block (2 levels) in _map_collection'
  (gem) jbuilder-2.11.2/lib/jbuilder.rb:346:in `_scope'
  (gem) jbuilder-2.11.2/lib/jbuilder.rb:339:in `block in _map_collection'
  (gem) activerecord-5.0.7.2/lib/active_record/relation/delegation.rb:38:in `map'
  (gem) activerecord-5.0.7.2/lib/active_record/relation/delegation.rb:38:in `map'
  (gem) jbuilder-2.11.2/lib/jbuilder.rb:338:in `_map_collection'
  (gem) jbuilder-2.11.2/lib/jbuilder.rb:216:in `array!'
  (gem) jbuilder-2.11.2/lib/jbuilder/jbuilder_template.rb:90:in `array!'
  app/views/assignments/index.json.jbuilder:8:in `_app_views_assignments_index_json_jbuilder__1085023644391212852_37504860'

我的新 assignments_controller 已在“new”操作和 assignment_params 中進行了修改

class AssignmentsController < ApplicationController
  before_action :set_assignment, only: [:show, :edit, :update, :destroy]
  skip_before_action :verify_authenticity_token #TODO refactor this line to be very specific

  # GET /assignments or /assignments.json
  def index
    # @assignments = Assignment.limit(20)
    # @assignments = Assignment.where(start: params[:start]..params[:end])
    @assignments = Assignment.date_range(params[:start]..params[:end])

  end

  # GET /assignments/1 or /assignments/1.json
  def show
  end

  # GET /assignments/new
  def new
    @assignment = Assignment.new
    #fixme: build goes here
    @assignment.volunteer_shift.build
    @my_url = {:action => "create", :id => params[:id]}

  end

  # GET /assignments/1/edit
  def edit
  end

  # POST /assignments or /assignments.json
  def create
    @assignment = Assignment.new(assignment_params)

    # error wants contact.id not contact_id ???

    respond_to do |format|
      if @assignment.save
        format.html { redirect_to @assignment, notice: "Assignment was successfully created." }
        format.json { render :show, status: :created, location: @assignment }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render json: @assignment.errors, status: :unprocessable_entity }
      end
    end
  end


  # PATCH/PUT /assignments/1 or /assignments/1.json
  def update

    @assignment.update(assignment_params)
  end

  # DELETE /assignments/1 or /assignments/1.json
  def destroy
    @assignment.destroy
    # NOTE: comment original out 4 now
    # respond_to do |format|
    #   format.html { redirect_to assignments_url, notice: "Assignment was successfully destroyed." }
    #   format.json { head :no_content }
    # end
  end

  private
    # Use callbacks to share common setup or constraints between actions.
    def set_assignment
      @assignment = Assignment.find(params[:id])
    end

    # Only allow a list of trusted parameters through.
    def assignment_params
      #fixme: ,volunteer_shift_attributes: [:???, :???, :???] <--- insert this below?
      params.require(:assignment).permit(:title,
        :redirect_to, :set_date, :date_range, :contact_id,
        :start_time, :end_time, :start, :end, :attendance_type_id, :notes,
        :call_status_type_id, :closed, :lock_version, :color,
         volunteer_shift_attributes: [:volunteer_task_type_id,:roster_id,:program_id,:set_description,:set_date,:id,:destroy])
    end
end

下面是三個相關的模型關聯

class VolunteerEvent < ApplicationRecord
  belongs_to :volunteer_default_event
  validates_presence_of :date
  has_many :volunteer_shifts, :dependent => :destroy
  has_many :resources_volunteer_events, :dependent => :destroy
  validates_associated :volunteer_shifts
...
end
class VolunteerShift < ApplicationRecord
  validates_presence_of :roster_id #fixme: remove these validations?
  validates_presence_of :end_time #fixme: remove these validations?
  validates_presence_of :start_time #fixme: remove these validations?
  belongs_to :volunteer_default_shift

  belongs_to :volunteer_task_type
  has_many :assignments
  belongs_to :program
  belongs_to :roster
  belongs_to :volunteer_event

  has_many :contact_volunteer_task_type_counts, :primary_key => 'volunteer_task_type_id', :foreign_key => 'volunteer_task_type_id' #:through => :volunteer_task_type

...
end
class Assignment < ApplicationRecord
  attr_accessor :volunteer_shift #,:contact_id ???
  belongs_to :volunteer_shift
  has_one :volunteer_task_type, :through => :volunteer_shift, :source => :volunteer_task_type
  belongs_to :contact ,optional: true
  validates_presence_of :volunteer_shift
  validates_associated :volunteer_shift
  belongs_to :attendance_type
  belongs_to :call_status_type
  validates_presence_of :set_date, :if => :volshift_stuck
  # validates_existence_of :contact, :allow_nil => true <----THIS IS BAD
  accepts_nested_attributes_for :volunteer_shift, allow_destroy: true

  #fixme: Nodule::DelegationError -
  # This error appears when trying to show the "Add New Assignment" model on the /assignments view
  delegate :set_date, :set_date=, :to => :volunteer_shift
  delegate :set_description, :set_description=, :to => :volunteer_shift

  scope :date_range, lambda { |range|
    joins(volunteer_shift: :volunteer_event)
        .where(volunteer_shifts: { volunteer_events: { date: range } })
  }
  scope :is_after_today, lambda {||
    { :conditions => ['(SELECT date FROM volunteer_events WHERE id = (SELECT volunteer_event_id FROM volunteer_shifts WHERE id = assignments.volunteer_shift_id)) > ?', Date.today] }
  }
  scope :on_or_after_today, lambda {||
    { :conditions => ['(SELECT date FROM volunteer_events WHERE id = (SELECT volunteer_event_id FROM volunteer_shifts WHERE id = assignments.volunteer_shift_id)) >= ?', Date.today] }
  }
  scope :not_cancelled, -> { where('(attendance_type_id IS NULL OR attendance_type_id NOT IN (SELECT id FROM attendance_types WHERE cancelled = \'t\'))')}
  scope :roster_is_limited_by_program, -> {where("roster_id IN (SELECT id FROM rosters WHERE limit_shift_signup_by_program = 't')").joins(:volunteer_shift)}

  attr_accessor :attendance_type_id



  #fixme: fix all red dots on this page
  def real_programs
    return [] unless self.volunteer_shift&.roster
    return [] unless self.volunteer_shift.roster.limit_shift_signup_by_program
    self.volunteer_shift.roster.skeds.select{|x| x.category_type == "Program"}.map{|x| x.name}
  end

# TODO: find all time_range_s methods and either pull out to DRY or give unique names
  def time_range_s
    return "" unless start_time and end_time
    (start_time.strftime("%I:%M")   ' - '   end_time.strftime("%I:%M")).gsub( ':00', '' ).gsub( ' 0', ' ').gsub( ' - ', '-' ).gsub(/^0/, "")
  end

  def description
    self.volunteer_shift.volunteer_event.date.strftime("%D")   " "   self.time_range_s   " "   self.slot_type_desc
  end

  def roster_title
    self.volunteer_shift.roster.name
  end

  #fixme: date / set_date is fracked since old code was ported over
   def date
     volunteer_shift.date
   end

  #full calendar uses this method name....see the assignment.json.jbuilder
  def event_date
    self.date
  end

  def slot_type_desc
    b = (self.volunteer_shift.volunteer_task_type_id.nil? ? self.volunteer_shift.volunteer_event.description : self.volunteer_shift.volunteer_task_type.description)
    b = b   " (#{self.volunteer_shift.description})" if self.volunteer_shift.description and self.volunteer_shift.description.length > 0
    b
  end

  def display_name
    ((!(self.volunteer_shift.description.nil? or self.volunteer_shift.description.blank?)) ? self.volunteer_shift.description   ": " : "")   self.contact_display
  end

  def cancelled?
    (self.attendance_type&.cancelled)
  end

  def attended?
    (self.attendance_type and !self.attendance_type.cancelled)
  end

  def contact_display
    if self.closed
      "(closed)"
    elsif contact_id.nil?
      return "(available)"
    else
      self.contact.display_name   "(#{self.voltask_count})"
    end
  end

  def <=>(other)
    self.date <=> other.date
  end

  # arieljuod thinks this is suspect. "belongs_to :contact" should have taken care of setting contact object
  # def contact_id=(new_val)
  #   self.write_attribute(:contact_id, new_val)
  #   self.contact = Contact.find_by_id(new_val.to_i)
  # end

  def contact_id_and_by_today
    # Unless the contact id is empty, or the event date is after today.
    !(contact_id.nil? || self.volunteer_shift.volunteer_event.date > Date.today)
  end

  def voltask_count
    self.contact_volunteer_task_type_count ? self.contact_volunteer_task_type_count.attributes["count"] : 0
  end

  before_validation :set_values_if_stuck
  def set_values_if_stuck
    return unless volshift_stuck
    volunteer_shift.set_values_if_stuck(self)
  end

  after_destroy { |record| if record.volunteer_shift&.stuck_to_assignment; record.volunteer_shift.destroy; else VolunteerShift.find_by_id(record.volunteer_shift_id).fill_in_available; end}
  after_save {|record| if record.volunteer_shift&.stuck_to_assignment; record.volunteer_shift.save; end}
  after_save { |record| VolunteerShift.find_by_id(record.volunteer_shift_id).fill_in_available }

  # def volunteer_shift_attributes=(attrs) #fixme: why is this not getting called on volunteer_events/create_shift?
  #   self.volunteer_shift.attributes=(attrs) # just pass it up
  # end

#fixme: where is stuck_to_assignment ??? WTF?
  def volshift_stuck
    self.volunteer_shift&.stuck_to_assignment
  end

  def first_time_in_area?
    if self.contact and self.volunteer_shift and self.volunteer_shift.volunteer_task_type
      !ContactVolunteerTaskTypeCount.has_volunteered?(self.contact_id, self.volunteer_shift.volunteer_task_type_id)
    else
      false
    end #  and self.contact_id_changed? moved outside because we use update_attributes
  end

#for fullcalendar
  def all_day_event?
    self.start_time == self.start_time.midnight && self.end_time == self.end_time.midnight ? true : false
  end
end

...

end

我不知道發生了什么……為什么 jbuilder 現在壞了?是因為嵌套表單嗎?它與我的模型有關系嗎?我的 assignment_params 有什么問題???

如何重寫我的 index.json.jbuilder?

(Note: I suspect I have to do some nested array stuff in my json file, but I've not done that before...https://stackoverflow.com/questions/35749301/get-nested-arrays-in-json)

UPDATE:

So, I tested a theory out If I switch branches to an earlier version pre-nested form....all my json output gets displayed. If I switch back to the nested form branch I do not get any json output that my main page uses to display. (note: I have not been able to add a new record as the link to add a new record is on the main page...that now does not get displayed). Process of elimination points to the model associations recently added when I was trying to create a Nested Form. But if I comment those lines out... line 2 and 12... in my assignment model...

class Assignment < ApplicationRecord
  # attr_accessor :volunteer_shift #,:contact_id ???  <----TURN THIS OFF AND JSON DISPLAYS AGAIN
  belongs_to :volunteer_shift
  has_one :volunteer_task_type, :through => :volunteer_shift, :source => :volunteer_task_type
  belongs_to :contact ,optional: true
  validates_presence_of :volunteer_shift #belongs_to takes care of this now
  validates_associated :volunteer_shift
  belongs_to :attendance_type
  belongs_to :call_status_type
  validates_presence_of :set_date, :if => :volshift_stuck #belongs_to takes care of this now??
  #accepts_nested_attributes_for :volunteer_event, allow_destroy: true <----TURN THIS OFF

The json outputs to the main screen again no problems.

UPDATE 2:

如果我只是注釋掉 assignment.rb 的第 2 行所有 json 資料收割者

uj5u.com熱心網友回復:

錯誤資訊

NoMethodError - undefined method `volunteer_event` for nil:NilClass:
app/models/assignment.rb:50:in `description'

告訴在檔案description中的方法中50在一個實體上app/models/assignment.rb呼叫volunteer_eventnil:NilClass

def description
  self.volunteer_shift.volunteer_event.date.strftime("%D")   " "   self.time_range_s   " "   self.slot_type_desc
end

這意味著self.volunteer_shift必須回傳nil并且您的資料庫中有沒有volunteer_shift分配的分配。

此修復程式取決于您的應用程式,但一個簡單的解決方案可能是有description回傳nil時,有沒有volunteer_shift-這樣的

def description
  return unless volunteer_shift

  self.volunteer_shift.volunteer_event.date.strftime("%D")   " "   self.time_range_s   " "   self.slot_type_desc
end

uj5u.com熱心網友回復:

更新

  attr_accessor :volunteer_shift #,:contact_id ??? 

這條線將一直隱藏

  belongs_to :volunteer_shift

宣告,這就是為什么沒有資料顯示的原因,您仍然應該檢查和驗證,盡管如下所述。


@spickermann 在他們的回答中幾乎已經解決了您的問題,但這不是一個完整的解決方案。

  1. 您的資料被弄亂了,因為您正在創建沒有關聯志愿者班次記錄的分配記錄。

允許發生這種情況是因為之前阻止這種情況發生的檢查已經過時,并且只能在具有這些validates_presence_of方法的舊版本 rails 中按預期作業,因此它們需要更新。

  1. 您需要進行測驗以確保這種情況不再發生,如果再次發生,您將立即收到通知。rspec、capybara 和帶防護的 factorybot 是我選擇的替代標準 Rails 測驗框架的工具,但是,您使用的工具應該是您的偏好,只需確保您具有創建和更新分配記錄的測驗覆寫范圍,以確保您擁有有效的志愿者輪班記錄,這樣您就可以知道何時解決了導致此問題的原始問題,而不僅僅是何時處理了此特定問題。

  2. 最后,您要么需要修復您的資料,要么需要按照@spickermann 的建議,在您的分配模型中通過檢查志愿者的移位是否不為零,向在您的分配模型中使用志愿者移位的任何方法添加檢查,并且可能同時執行這兩件事。

轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/353883.html

標籤:红宝石轨道 红宝石

上一篇:Rails與Ruby版本沖突

下一篇:(ArgumentError)Ruby:引數數量錯誤

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • vue移動端上拉加載

    可能做得過于簡單或者比較low,請各位大佬留情,一起探討技術 ......

    uj5u.com 2020-09-10 04:38:07 more
  • 優美網站首頁,頂部多層導航

    一個個人用的瀏覽器首頁,可以把一下常用的網站放在這里,平常打開會比較方便。 第一步,HTML代碼 <script src=https://www.cnblogs.com/szharf/p/"js/jquery-3.4.1.min.js"></script> <div id="navigate"> <ul> <li class="labels labels_1"> ......

    uj5u.com 2020-09-10 04:38:47 more
  • 頁面為要加<!DOCTYPE html>

    最近因為寫一個js函式,需要用到$(window).height(); 由于手寫demo的時候,過于自信,其實對前端方面的認識也不夠體系,用文本檔案直接敲出來的html代碼,第一行沒有加上<!DOCTYPE html> 導致了$(window).height();的結果直接是整個document的高 ......

    uj5u.com 2020-09-10 04:38:52 more
  • WordPress網站程式手動升級要做好資料備份

    WordPress博客網站程式在進行升級前,必須要做好網站資料的備份,這個問題良家佐言是遇見過的;在剛開始接觸WordPress博客程式的時候,因為升級問題和博客網站的修改的一些嘗試,良家佐言是吃盡了苦頭。因為購買的是西部數碼的空間和域名,每當佐言把自己的WordPress博客網站搞到一塌糊涂的時候 ......

    uj5u.com 2020-09-10 04:39:30 more
  • WordPress程式不能升級為5.4.2版本的原因

    WordPress是一款個人博客系統,受到英文博客愛好者和中文博客愛好者的追捧,并逐步演化成一款內容管理系統軟體;它是使用PHP語言和MySQL資料庫開發的,用戶可以在支持PHP和MySQL資料庫的服務器上使用自己的博客。每一次WordPress程式的更新,就會牽動無數WordPress愛好者的心, ......

    uj5u.com 2020-09-10 04:39:49 more
  • 使用CSS3的偽元素進行首字母下沉和首行改變樣式

    網頁中常見的一種效果,首字改變樣式或者首行改變樣式,效果如下圖。 代碼: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ......

    uj5u.com 2020-09-10 04:40:09 more
  • 關于a標簽的講解

    什么是a標簽? <a> 標簽定義超鏈接,用于從一個頁面鏈接到另一個頁面。 <a> 元素最重要的屬性是 href 屬性,它指定鏈接的目標。 a標簽的語法格式:<a href=https://www.cnblogs.com/summerxbc/p/"指定要跳轉的目標界面的鏈接">需要展示給用戶看見的內容</a> a標簽 在所有瀏覽器中,鏈接的默認外觀如下: 未被訪問的鏈接帶 ......

    uj5u.com 2020-09-10 04:40:11 more
  • 前端輪播圖

    在需要輪播的頁面是引入swiper.min.js和swiper.min.css swiper.min.js地址: 鏈接:https://pan.baidu.com/s/15Uh516YHa4CV3X-RyjEIWw 提取碼:4aks swiper.min.css地址 鏈接:https://pan.b ......

    uj5u.com 2020-09-10 04:40:13 more
  • 如何設定html中的背景圖片(全屏顯示,且不拉伸)

    1 <style>2 body{background-image:url(https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture); 3 background-size:cover;background ......

    uj5u.com 2020-09-10 04:40:16 more
  • Java學習——HTML詳解(上)

    HTML詳解 初識HTML Hyper Text Markup Language(超文本標記語言) 1 <!--DOCTYPE:告訴瀏覽器我們要使用什么規范--> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <!--meta 描述性的標簽,描述一些 ......

    uj5u.com 2020-09-10 04:40:33 more
最新发布
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 07:59:23 more
  • 生產事故-走近科學之消失的JWT

    入職多年,面對生產環境,盡管都是小心翼翼,慎之又慎,還是難免捅出簍子。輕則滿頭大汗,面紅耳赤。重則系統停擺,損失資金。每一個生產事故的背后,都是寶貴的經驗和教訓,都是專案成員的血淚史。為了更好地防范和遏制今后的各類事故,特開此專題,長期更新和記錄大大小小的各類事故。有些是親身經歷,有些是經人耳傳口授 ......

    uj5u.com 2023-04-18 07:55:04 more
  • 記錄--Canvas實作打飛字游戲

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 打開游戲界面,看到一個畫面簡潔、卻又富有挑戰性的游戲。螢屏上,有一個白色的矩形框,里面不斷下落著各種單詞,而我需要迅速地輸入這些單詞。如果我輸入的單詞與螢屏上的單詞匹配,那么我就可以獲得得分;如果我輸入的單詞錯誤或者時間過長,那么我就會輸 ......

    uj5u.com 2023-04-04 08:35:30 more
  • 了解 HTTP 看這一篇就夠

    在學習網路之前,了解它的歷史能夠幫助我們明白為何它會發展為如今這個樣子,引發探究網路的興趣。下面的這張圖片就展示了“互聯網”誕生至今的發展歷程。 ......

    uj5u.com 2023-03-16 11:00:15 more
  • 藍牙-低功耗中心設備

    //11.開啟藍牙配接器 openBluetoothAdapter //21.開始搜索藍牙設備 startBluetoothDevicesDiscovery //31.開啟監聽搜索藍牙設備 onBluetoothDeviceFound //30.停止監聽搜索藍牙設備 offBluetoothDevi ......

    uj5u.com 2023-03-15 09:06:45 more
  • canvas畫板(滑鼠和觸摸)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>canves</title> <style> #canvas { cursor:url(../images/pen.png),crosshair; } #canvasdiv{ bo ......

    uj5u.com 2023-02-15 08:56:31 more
  • 手機端H5 實作自定義拍照界面

    手機端 H5 實作自定義拍照界面也可以使用 MediaDevices API 和 <video> 標簽來實作,和在桌面端做法基本一致。 首先,使用 MediaDevices.getUserMedia() 方法獲取攝像頭媒體流,并將其傳遞給 <video> 標簽進行渲染。 接著,使用 HTML 的 < ......

    uj5u.com 2023-01-12 07:58:22 more
  • 記錄--短視頻滑動播放在 H5 下的實作

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 短視頻已經無數不在了,但是主體還是使用 app 來承載的。本文講述 H5 如何實作 app 的視頻滑動體驗。 無聲勝有聲,一圖頂百辯,且看下圖: 網址鏈接(需在微信或者手Q中瀏覽) 從上圖可以看到,我們主要實作的功能也是本文要講解的有: ......

    uj5u.com 2023-01-04 07:29:05 more
  • 一文讀懂 HTTP/1 HTTP/2 HTTP/3

    從 1989 年萬維網(www)誕生,HTTP(HyperText Transfer Protocol)經歷了眾多版本迭代,WebSocket 也在期間萌芽。1991 年 HTTP0.9 被發明。1996 年出現了 HTTP1.0。2015 年 HTTP2 正式發布。2020 年 HTTP3 或能正... ......

    uj5u.com 2022-12-24 06:56:02 more
  • 【HTML基礎篇002】HTML之form表單超詳解

    ??一、form表單是什么

    ??二、form表單的屬性

    ??三、input中的各種Type屬性值

    ??四、標簽 ......

    uj5u.com 2022-12-18 07:17:06 more