HistoryART
@HistoryART
Целеустремлённый

Почему скрипт циклически обрабатывает каждую строку десятки раз?

Добрый вечер.Я пытаюсь вывести меню,до этого оно выводилось на 1 секунду и пропадало,сейчас я все-же смог его вывести,но некорректно..
Помогите пожалуйста..

Клиент:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1.0,width=device-width,height=device-height,user-scalable=no">
	<title>Menu</title>
	<style type="text/css">
		nav {
			color: #555;
		}
	</style>
</head>
<body>

	<nav></nav>


	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="/socket.io/socket.io.js"></script>	

	<script type="text/javascript">

		var io = io('http://localhost:3000/');

			function makeMenuLevel(menuItems) {
				 
					  return `<ul>${menuItems.map(
					    item =>`<li>${item.title}${item.children ? makeMenuLevel(item.children) : ''}</li>`
					  ).join('')}</ul>`;
				
			}

			

          	$(document).on('click',(e) => {

          		var xhr = new XMLHttpRequest();

				var body = 'id=' + encodeURIComponent(123);

				xhr.open("POST", '/menu', true);
				xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

				xhr.send(body);

          	})

          	io.on('menu', (data) => {
	          	const menu = makeMenuLevel(data)
	          	$('nav').append(menu)
	          	console.log(data)
	        })

	</script>
</body>
</html>


Server:

app.get('/menu', (req,res) => {
	res.sendFile(__dirname + '/menu.html')
})

app.post('/menu', (req,res) => {
	connection.query('SELECT * FROM menu', (err, result) => {
		  if(err) {
		    console.error(err);
		    return;
		  }
		  const index = result.reduce((acc, row) => ({...acc, [row.id]: row}), {});
		  var menu = [];
		  for(const row of result) {
		    if(row.parent_id === 0) {
		      menu.push(row);
		      continue;
		    }
		    const parent = index[row.parent_id];
		    if(!parent) {
		      console.warn(`Undefined parent with id ${row.parent_id}`);
		      continue;
		    }
		    if(!parent.children) {
		      parent.children = [];
		    }
		    parent.children.push(row);

		    return io.emit('menu',menu)
		  }
		});
})
  • Вопрос задан
  • 80 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
20 нояб. 2019, в 17:06
5000 руб./за проект
20 нояб. 2019, в 16:17
500 руб./в час
20 нояб. 2019, в 15:44
100000 руб./за проект