This article uses the installed Rails 6.0.0 About JavaScript in it. While making a copy app of the flea market app with Rails, I implemented the selling price with JavaScript!
item_price.js
window.addEventListener('load', () => {
const itemPrice = document.getElementById("item-price");
itemPrice.addEventListener("input", () => {
const inputValue = itemPrice.value;
const addTaxDom = document.getElementById("add-tax-price");
addTaxDom.innerHTML = (Math.floor(inputValue * 0.1));
const saleProfit = document.getElementById("profit");
const value_result = inputValue * 0.1
saleProfit.innerHTML = (Math.floor(inputValue - value_result));
})
});
The implementation was successful and I was happy to move on to the next implementation, and sometimes when I entered the price to list, the commission and profit calculation did not work. Why? As a result of various trials and errors, it seems that this description was bad.
require("turbolinks").start()
This description is the description defined in application.js. Please pay attention to "turbolinks" in this. The meaning is "a library for speeding up page transitions by Ajax". It's a great advantage, but it seems that it sometimes has bad Java Script, causes small bugs, does not call ready, does not change header, etc. Lol I would like to use it because it has merits, but what kind of time is it used?
If you want to speed up page rendering even at higher development costs When the amount of Javascript description is small Sites that mainly return views created from Rails, etc.
On the contrary, sites of a scale that does not need to speed up page rendering, etc. When the amount of Javascript description is large If you write css or JavaScript separately for each page, the merit of using it will be reduced.
When using Turbolinks, you need to understand the behavior well. We recommend that you carefully consider the merits and demerits of the product before operating it.
Recommended Posts