question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Browser console error with @ref function call

See original GitHub issue

When calling a function belonging to an @ref element, an error can occur depending on the format of the function call. Does @onclick not always expect C# code?

<!--Runs as expected-->
<button type="button" @onclick="@(() => myComponent.DoSomething())">Do Something</button>

<!--Produces an error in the browser console on load (though this is the typical format for a function call with no parameters)-->
<button type="button" @onclick="myComponent.DoSomething">Do Something</button>

<MyComponent @ref="myComponent" />

@code {
    private MyComponenet myComponent { get; set; }
}

Error

Delegate to an instance method cannot have null ‘this’

IDE: VS Mac 8.7.0.1077

dotnet --info: .NET Core SDK (reflecting any global.json): Version: 3.1.300 Commit: b2475c1295

Runtime Environment: OS Name: Mac OS X OS Version: 10.15 OS Platform: Darwin RID: osx.10.15-x64 Base Path: /usr/local/share/dotnet/sdk/3.1.300/

Host (useful for support): Version: 3.1.4 Commit: 0c2e69caa6

.NET Core SDKs installed: 3.1.100 [/usr/local/share/dotnet/sdk] 3.1.101 [/usr/local/share/dotnet/sdk] 3.1.102 [/usr/local/share/dotnet/sdk] 3.1.200 [/usr/local/share/dotnet/sdk] 3.1.201 [/usr/local/share/dotnet/sdk] 3.1.202 [/usr/local/share/dotnet/sdk] 3.1.300 [/usr/local/share/dotnet/sdk]

.NET Core runtimes installed: Microsoft.AspNetCore.App 3.1.0 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 3.1.1 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 3.1.2 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 3.1.3 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 3.1.4 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App] Microsoft.NETCore.App 2.1.14 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 2.1.16 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 2.1.17 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 2.1.18 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.0 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.1 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.2 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.3 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.4 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
guardrexcommented, Jun 8, 2020

Thanks @mrlife … I’ll open an issue for a little call out on that.

0reactions
mrlifecommented, Jun 8, 2020

So maybe the distinction I was missing is purely about direct reference vs lambda of an @ref property, where direct is processed on component load and lambda is processed only when needed?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Calling a Javascript Function from Console
My hypothesis is that calling eval from the console remains in the context of console, and we need to execute in the context...
Read more >
Type Error vs Reference Error in JavaScript – What's the ...
You encountered an error because you tried to call a function with the variable name. A variable cannot be called as a function....
Read more >
Fix JavaScript errors that are reported in the Console
Demo page: JavaScript error reported in the Console tool ... Right-click anywhere in the webpage and then select Inspect. Or, press F12. DevTools ......
Read more >
ReferenceError - JavaScript - MDN Web Docs
The ReferenceError object represents an error when a variable that doesn't exist (or hasn't yet been initialized) in the current scope is ...
Read more >
Error.prototype.stack - JavaScript - MDN Web Docs
The non-standard stack property of an Error instance offers a trace of which functions were called, in what order, from which line and...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found