search

Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.3k stars 533 forks source link

[Bug]: File "Carousel.razor.cs", line 451 >>> System.NullReferenceException #5725

Closed SeanHogg closed 2 weeks ago

SeanHogg commented 2 months ago

Blazorise Version

1.6.1

What Blazorise provider are you running on?

Bootstrap5

Link to minimal reproduction or a simple code snippet

Use this code:

<Carousel @bind-SelectedSlide="@selectedSlide" Autoplay="false" Interval="15000">
    <CarouselSlide Name="1">
        <Container>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6 order-2 order-md-1 text-center text-md-left">
                        <h1 class="text-white font-weight-bold mb-4">Restaurant, Bar, Entertainment? Free Business Listing.</h1>
                        <p class="text-white mb-5">
                            We want to increase in person dating. Sign-up to have your business listed. We'll recommend your business when selecting where to go or what to do on a date. </p>
                        <AuthorizeView>
                            <NotAuthorized>
                                <a href="account/login" class="btn btn-main-md">Business Listing</a>
                            </NotAuthorized>
                            <Authorized>
                                <a href="business/listing" class="btn btn-main-md">My Listing</a>
                            </Authorized>
                        </AuthorizeView>

                    </div>
                    <div class="col-md-6 text-center order-1 order-md-2">
                        <img class="img-fluid" src="images/mobile.png" alt="screenshot">
                    </div>
                </div>
            </div>
        </Container>
    </CarouselSlide>
    <CarouselSlide Name="2">
        <Container>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6 order-2 order-md-1 text-center text-md-left">
                        <h1 class="text-white font-weight-bold mb-4">Create an Ad. Increase Sales. </h1>
                        <p class="text-white mb-5">
                            75% of 18-to-54 year olds in 20+ countries are on RumbleDating.com. Engage your audience. Make an Impact. All Ads are displayed in the mobile application. See details below for a specific package.
                        </p>
                        <AuthorizeView>
                            <NotAuthorized>
                                <a href="account/login" class="btn btn-main-md">Advertise Now</a>
                            </NotAuthorized>
                            <Authorized>
                                <a href="advertising/campaign" class="btn btn-main-md">Advertise Now</a>
                            </Authorized>
                        </AuthorizeView>

                    </div>
                    <div class="col-md-6 text-center order-1 order-md-2">
                        <img class="img-fluid" src="images/mobile.png" alt="screenshot">
                    </div>
                </div>
            </div>
        </Container>
    </CarouselSlide>
</Carousel>

@code {

string selectedSlide = "1";

}

Steps to reproduce

Use the code and get this error:

System.NullReferenceException: Object reference not set to an instance of an object. File "Carousel.razor.cs", line 451, in async Task Carousel.RunAnimations() await Task.Delay( selectedSlide.AnimationTime ); File "Carousel.razor.cs", line 358, in async void Carousel.OnTimerEvent(object source, ElapsedEventArgs e) await InvokeAsync( RunAnimations );

What is expected?

No exceptions

What is actually happening?

Throws an nullreferenceexception

What browsers do you see the problem on?

Chrome, Microsoft Edge, Safari, Firefox, Vivaldi, Brave

Any additional comments?

No response

David-Moreira commented 1 month ago

Hello @SeanHogg

Used : 

<Carousel @bind-SelectedSlide="@selectedSlide" Autoplay="false" Interval="15000">
    <CarouselSlide Name="1">
        <Container>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6 order-2 order-md-1 text-center text-md-left">
                        <h1 class="text-white font-weight-bold mb-4">Restaurant, Bar, Entertainment? Free Business Listing.</h1>
                        <p class="text-white mb-5">
                            We want to increase in person dating. Sign-up to have your business listed. We'll recommend your business when selecting where to go or what to do on a date. </p>
@*                         <AuthorizeView>
                            <NotAuthorized>
                                <a href="account/login" class="btn btn-main-md">Business Listing</a>
                            </NotAuthorized>
                            <Authorized>
                                <a href="business/listing" class="btn btn-main-md">My Listing</a>
                            </Authorized>
                        </AuthorizeView> *@

                    </div>
                    <div class="col-md-6 text-center order-1 order-md-2">
                        <img class="img-fluid" src="_content/Blazorise.Demo/img/slides/slide-01.jpg" alt="screenshot">
                    </div>
                </div>
            </div>
        </Container>
    </CarouselSlide>
    <CarouselSlide Name="2">
        <Container>
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6 order-2 order-md-1 text-center text-md-left">
                        <h1 class="text-white font-weight-bold mb-4">Create an Ad. Increase Sales. </h1>
                        <p class="text-white mb-5">
                            75% of 18-to-54 year olds in 20+ countries are on RumbleDating.com. Engage your audience. Make an Impact. All Ads are displayed in the mobile application. See details below for a specific package.
                        </p>
@*                         <AuthorizeView>
                            <NotAuthorized>
                                <a href="account/login" class="btn btn-main-md">Advertise Now</a>
                            </NotAuthorized>
                            <Authorized>
                                <a href="advertising/campaign" class="btn btn-main-md">Advertise Now</a>
                            </Authorized>
                        </AuthorizeView> *@

                    </div>
                    <div class="col-md-6 text-center order-1 order-md-2">
                        <img class="img-fluid" src="_content/Blazorise.Demo/img/slides/slide-02.jpg" alt="screenshot">
                    </div>
                </div>
            </div>
        </Container>
    </CarouselSlide>
</Carousel>

@code {

    string selectedSlide = "1";
}

Cannot reproduce. There must be something special you're doing in your project. Can I ask that you provide an actual github repro?

github-actions[bot] commented 1 month ago

Hello @SeanHogg, thank you for your submission. The issue was labeled "Status: Repro Missing", as you have not provided a way to reproduce the issue quickly. Most problems already solve themselves when isolated, but we would like you to provide us with a reproducible code to make it easier to investigate a possible bug.