文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >在带注入脚本的页面离开后，在Blazor中发布RenderFragment

问在带注入脚本的页面离开后，在Blazor中发布RenderFragment
EN

Stack Overflow用户
提问于 2020-08-15 21:30:01
回答 1查看 1K关注 0票数 0

因此，我一直在学习如何使用RenderFragment在Blazor中创建动态html，到目前为止，大多数测试都运行良好，除非生成html，它注入了修改最终结果的javascript。在本例中，我正在为LinkedIn按钮生成脚本

代码语言：javascript
复制
public RenderFragment RenderButton()
{
    RenderFragment form = b =>
    {
        if (this.AddPlatformScript)
        {
            b.OpenElement(1, "script");
            b.AddAttribute(1, "src", "https://platform.linkedin.com/in.js");
            b.AddAttribute(1, "type", "text/javascript");
            b.CloseElement();
        }
        b.OpenElement(2, "script");
        b.AddAttribute(2, "data-url", $"{this.UrlToShare}");
        b.AddAttribute(3, "type", "IN/Share");
        b.CloseElement();
    };
    return form;
}

呈现项目的代码是以下公共RenderFragment UIFragment { get；私有集；}

代码语言：javascript
复制
    protected override void OnInitialized()
    {
        this.UIFragment = this.RenderButton();
    }

问题是，一旦我离开该页面，我就会得到以下错误

代码语言：javascript
复制
**crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: Cannot read property 'removeChild' of null
      TypeError: Cannot read property 'removeChild' of null
          at e (https://localhost:5001/_framework/blazor.webassembly.js:1:6918)
          at e (https://localhost:5001/_framework/blazor.webassembly.js:1:6890)
          at Object.e [as removeLogicalChild] (https://localhost:5001/_framework/blazor.webassembly.js:1:6890)
          at e.applyEdits (https://localhost:5001/_framework/blazor.webassembly.js:1:13649)
          at e.updateComponent (https://localhost:5001/_framework/blazor.webassembly.js:1:12880)
          at Object.t.renderBatch (https://localhost:5001/_framework/blazor.webassembly.js:1:1704)
          at Object.window.Blazor._internal.renderBatch (https://localhost:5001/_framework/blazor.webassembly.js:1:34784)
          at _mono_wasm_invoke_js_unmarshalled (https://localhost:5001/_framework/wasm/dotnet.3.2.0.js:1:172099)
          at wasm_invoke_iiiiii (https://localhost:5001/_framework/wasm/dotnet.wasm:wasm-function[3160]:0x9b33d)
          at icall_trampoline_dispatch (https://localhost:5001/_framework/wasm/dotnet.wasm:wasm-function[5777]:0xfe711)
Microsoft.JSInterop.JSException: Cannot read property 'removeChild' of null
TypeError: Cannot read property 'removeChild' of null
    at e (https://localhost:5001/_framework/blazor.webassembly.js:1:6918)
    at e (https://localhost:5001/_framework/blazor.webassembly.js:1:6890)
    at Object.e [as removeLogicalChild] (https://localhost:5001/_framework/blazor.webassembly.js:1:6890)
    at e.applyEdits (https://localhost:5001/_framework/blazor.webassembly.js:1:13649)
    at e.updateComponent (https://localhost:5001/_framework/blazor.webassembly.js:1:12880)
    at Object.t.renderBatch (https://localhost:5001/_framework/blazor.webassembly.js:1:1704)
    at Object.window.Blazor._internal.renderBatch (https://localhost:5001/_framework/blazor.webassembly.js:1:34784)
    at _mono_wasm_invoke_js_unmarshalled (https://localhost:5001/_framework/wasm/dotnet.3.2.0.js:1:172099)
    at wasm_invoke_iiiiii (https://localhost:5001/_framework/wasm/dotnet.wasm:wasm-function[3160]:0x9b33d)
    at icall_trampoline_dispatch (https://localhost:5001/_framework/wasm/dotnet.wasm:wasm-function[5777]:0xfe711)
  at Microsoft.JSInterop.WebAssembly.WebAssemblyJSRuntime.InvokeUnmarshalled[T0,T1,T2,TResult] (System.String identifier, T0 arg0, T1 arg1, T2 arg2) <0x2cc84f0 + 0x00046> in <filename unknown>:0 
  at Microsoft.JSInterop.WebAssembly.WebAssemblyJSRuntime.InvokeUnmarshalled[T0,T1,TResult] (System.String identifier, T0 arg0, T1 arg1) <0x2cc8410 + 0x00014> in <filename unknown>:0 
  at Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer.UpdateDisplayAsync (Microsoft.AspNetCore.Components.RenderTree.RenderBatch& batch) <0x2cc8318 + 0x0001e> in <filename unknown>:0 
  at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue () <0x2b76b80 + 0x000f2> in <filename unknown>:0 
f.printErr @ blazor.webassembly.js:1
f.preRun.push.window.Blazor._internal.dotNetCriticalError @ blazor.webassembly.js:1
_mono_wasm_invoke_js_unmarshalled @ dotnet.3.2.0.js:1
do_icall @ dotnet.wasm:1
do_icall_wrapper @ dotnet.wasm:1
interp_exec_method @ dotnet.wasm:1
interp_runtime_invoke @ dotnet.wasm:1
mono_jit_runtime_invoke @ dotnet.wasm:1
do_runtime_invoke @ dotnet.wasm:1
mono_runtime_invoke_checked @ dotnet.wasm:1
mono_runtime_try_invoke_array @ dotnet.wasm:1
ves_icall_InternalInvoke @ dotnet.wasm:1
ves_icall_InternalInvoke_raw @ dotnet.wasm:1
do_icall @ dotnet.wasm:1
do_icall_wrapper @ dotnet.wasm:1
interp_exec_method @ dotnet.wasm:1
interp_runtime_invoke @ dotnet.wasm:1
mono_jit_runtime_invoke @ dotnet.wasm:1
do_runtime_invoke @ dotnet.wasm:1
mono_runtime_try_invoke @ dotnet.wasm:1
mono_runtime_invoke @ dotnet.wasm:1
mono_wasm_invoke_method @ dotnet.wasm:1
Module._mono_wasm_invoke_method @ dotnet.3.2.0.js:1
call_method @ dotnet.3.2.0.js:1
(anonymous) @ dotnet.3.2.0.js:1
beginInvokeDotNetFromJS @ blazor.webassembly.js:1
s @ blazor.webassembly.js:1
e.invokeMethodAsync @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
r @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
r @ blazor.webassembly.js:1
d @ blazor.webassembly.js:1
f @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
e.onGlobalEvent @ blazor.webassembly.js:1

，有人知道如何防止这种情况发生吗？

.net
.net-core
blazor
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-08-15 23:34:07

Blazor需要生成的html保持不变，或者它无法找到可靠的元素从DOM中删除。

如果您想要修改它，就需要使用AddMarkup添加它，传递一个包含您希望JS修改的所有html的MarkupString实例。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/63430986

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档