- 詳細內容
- 分類: Javascript
- 點擊數: 613
filter函數特性：
遍歷每個元素，回傳 true 時，目前的值會保留在陣列內，這會回傳一個新陣列，而不是修改原本的陣列。
原理
當input輸入文字時觸發onChenge事件，event.target.value值存入this.state.search，再利用this.state.search使用filter()回圈過濾data內的資料。
- 詳細內容
- 分類: Javascript
- 點擊數: 609
callback()
回調函數是一個作為參數傳遞給另一個函數的函數，然後在外部函數中調用該函數來完成某種例程或動作。
callback()簡單的例子：
function greeting(name) {
alert('Hello ' + name);
}
function processUserInput(callback) {
var name = prompt('Please enter your name.');
callback(name);
}
processUserInput(greeting);上面的例子是一個同步回調，因為它立即執行。
- 詳細內容
- 分類: Javascript
- 點擊數: 449
this.props.history.push
在導航時，您可以將傳遞道具傳遞給歷史對象
this.props.history.push({
pathname: '/template',
search: '?query=abc',
state: { detail: response.data }
})- 詳細內容
- 分類: Javascript
- 點擊數: 1040
使用update()函數經過AJAX方法更新表單。
var ajaxCallLiveSubs = function(){
// endopoint
var url = 'https://jsonplaceholder.typicode.com/posts/1';
var interval = 5000;
var time = 0;
// Live Subs Charts
var ctx_live = document.getElementById("myChart");
var liveChart = new Chart(ctx_live, {
type: 'line',
data: {
labels: [],
datasets: [{
data: [],
borderWidth: 1,
borderColor:'#00c0ef',
label: 'liveCount',
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
legend: {
display: false
},
scales: {
yAxes: [{
ticks: {
beginAtZero:true,
}
}]
}
}
});
var doAjax = function() {
$.ajax({
url: url,
success: function(){
var currentTime = ++time
var currentValue = Math.random()*1000;
liveChart.data.labels.push(currentTime);
liveChart.data.datasets[0].data.push(currentValue);
liveChart.update();
},
complete: function () {
// Schedule the next
setTimeout(doAjax, interval);
}
});
};
doAjax();
};
ajaxCallLiveSubs();- 詳細內容
- 分類: Javascript
- 點擊數: 963
陣列元素順序重新排序 sort()
排序函數 sort() 方法，預設為 ASCII 字符順序進行「升序排列」。
陣列.sort()
var Brand = ["Oldsmobile", "Pontiac", "Buick", "Cadillac", "Holden", "Saturn", "GMC"];
Brand.sort()
//輸出 Buick, Cadillac, GMC, Holden, Oldsmobile, Pontiac, Saturn陣列.reverse()順序反轉
Brand.sort() //陣列重新排序
Brand.reverse() //順序反轉(反轉元素的排列秩序)
//輸出 Saturn, Pontiac, Oldsmobile, Holden, GMC, Cadillac, Buick