关于ASP NET Core的视图组件的使用（ViewComponent）

问：

想请教一下关于视图组件在父页面中的占位问题

·

1、直接在父页面中使用<vc>标签占位（明确知道了视图组件在父页面中的位置）

<div id="first">

······<p> hello world </p>

··

······<vc:priority-list max-priority="2" is-done="false">

······</vc:priority-list>

</div>

2、从控制器直接调用视图组件（如何确定视图组件在父页面的位置？？）

public IActionResult IndexVC()

{

return ViewComponent("组件类名", （参数）new { maxPriority = 3, isDone = false });

}

 

答：

从 Controller 中直接返回 ViewComponent，返回结果是渲染好的 html，你可以通过 js 自行放到你想要的位置。

比如你有一个 ViewComponent，返回一行字 ​​<p>view component</p>​​。

访问 ​​/IndexVC​​ 这个路径，返回的就是 ​​<p>view component</p>​​。

你可以通过 js 拿到这段 html 代码放到你需要的位置。

<div id="first">
    <p> hello world </p>
    <div id="placeholder">
        <script>
            fetch('/IndexVC').then(res => res.text().then(text => document.getElementById('placeholder').innerHTML = text)) 
        </script>
    </div>
</div>