It is still totally unclear what you actually want to do, but according to this:
it works but the main loop generate duplicate posts
I can tell you that it is expected output.
Your “main” loop queries and displays all pages which has a parent page ID of 10. Lets say there are 10 pages that matches your “main”query, this will mean your loop will run through 10 cycles if you want to call it that. Think of the loop as a foreach loop as it is essentially just that (but not exactly the same).
Now, within each and every cycle, you are adding another query which queries pages wit a parent ID of 20. Lets say there are also 10. So each and every cycle of the “main” loop will output 10 posts with post parent of 20, 10 times because there are 10 pages with a parent of 10.
Very basic, you have:
// First cycle
the_post(); // 1st page with parent 10
// custom query which will display pages from parent 20
// End of first cycle and start of second cycle
the_post(); // 2nd page with parent 10
// custom query which will display pages from parent 20
// End of second cycle and start of third cycle
the_post(); // 3rd page with parent 10
// custom query which will display pages from parent 20
etc etc
You should take your second query outside the “main” one to separate them
$main_args = [
'post_type' => 'page',
'post_parent' => '10',
];
// execute the main query
$the_main_loop = new WP_Query($main_args);
// go main query
if($the_main_loop->have_posts()) {
while($the_main_loop->have_posts()) {
$the_main_loop->the_post();
// Display your loop content
} // endwhile
wp_reset_postdata(); // VERY VERY IMPORTANT
}
// define the inner query
$inner_args = [
'post_type' => 'page',
'post_parent' => '20',
];
// execute the inner query
$the_inner_loop = new WP_Query($inner_args);
// go inner query
if($the_inner_loop->have_posts()) {
while($the_inner_loop->have_posts()) {
$the_inner_loop->the_post();
// Display your loop content
} // endwhile
wp_reset_postdata(); // VERY VERY IMPORTANT
}