Användning av Gon Gem med Javascript & Rails

Att använda Rails-data som en del av javascript är ett extremt regelbundet behov, särskilt för Javascript-applikationer som Angular, Ember och SPA.

Om det är en liten mängd data kan vi direkt tilldela den till rubyvariablerna.

Från rälsvy:
Ex:-

HTML:

<input id="user" type="hidden" value="" /> ; $('#user').val();

HTML-dataattribut:

<%= content_tag "div", id: "posts", data: {posts: Post.limit(5)} till %> Laddar .. <% slut %>;

$('#posts').data('posts');

Från rails controllers genom att använda Gon:
Ovanstående scenarier verkar inte vara fläckfria och förnuftiga, särskilt när vi behöver mer information snarare än bara lite data.

Egentligen finns det en bra lösning för att skicka Rails-variabler från styrenheter till javascript, dvs gon gem.

Gon hjälper oss att tillgodose vårt behov på ett enklare och renare sätt.

Uppstart

Det är ganska lätt att sätta upp gon gem.

Lägg till gem 'gon' till Gemfile och kör paketinstallation
Föra in <%= include_gon %>; in head-taggen för layouts/application.html.erb. Du kan placera den var du vill använda. Flytta den till den specifika vyn om du bara vill använda den i den specifika vyn.

Ställ in variabler från kontroller/vy (oftast från kontroller)

gon.currentUser = @user gon.title = 'Sample Gon'

#or

gon.push({ currentUser: @user, title: 'Sample Gon'' })

Så i javascript kan vi använda dem som normala variabler

console.log(gon.currentUser); console.log(gon.title);

Anmärkningar:
Vi kan modifiera variabeln namnutrymme. Det betyder att vi kan använda app.variableName istället för gon.variableName. Men vi måste ange namnutrymme när vi inkluderar.

<%= include_gon(namnområde: 'app') %>;

Det finns andra listor med alternativ som vi kan ställa in för gon (https://github.com/gazay/gon/wiki/Options).
Gon kan användas med jbuilder och rabl(https://github.com/gazay/gon/wiki)
Tryck på minst en variabel till gon för att förhindra gon i ett ej definierat fel annars validera om den är definierad eller inte.
Gon-variabler kan laddas om från skenor genom att använda titta. Se den officiella gon-dokumentationen för mer information.

Resurser:
https://github.com/gazay/gon

Kolla in den här artikeln på vår Facebook-sida: https://www.facebook.com/RailsCarma