标签: parent-child

我创建了一个basicModalComponent，它负责处理基本操作，例如关闭、提交、显示页眉和页脚。将简单的消息放入我的模态正文中效果很好。

但我希望能够传递一个子组件来管理我的身体，如下所示：

this.modal = await this.modalController.create({
  component: BasicModalComponent,
  componentProps: {
    title: `Share!`,
    body: ChildContentViewComponent,
    bodyProps: {... some data here},
    // body: new ChildContentViewComponent({some data here}),
    confirm: this.onConfirmDeleteAction,
    cancelButton: true
  }
});

这将处理一些更复杂的逻辑。

现在，这就是身体在我的中显示的方式basicModalComponent

<p class="modal-body text-center scrollable scrollbar-hidden">
  {{body}}
</p>

显然，它与字符串文本配合得很好，但现在我想在这里放置一个子组件。

结果如下：

如果可能的话，在实例化期间使用来自父级的数据

但我不知道这是否可能或一个好的模式。我认为这是可能的，因为这就是modalController我实际上正在做的事情BasicModalComponent，但我仍然不确定这种模式。我研究过继承和组合，但也没有成功。

您有什么想法/建议吗？提前致谢。

目前，我正在使用面向节点的方法制作纸牌游戏（想想《炉石传说》）。这意味着，每张卡牌都是一个节点，要将卡牌移动到指定位置（例如，玩家的手或战斗场），我需要在父节点之间移动子节点。

例如，要将一张牌从我的手牌移到战斗场，我会在手牌上调用remove_child()，在战斗场上调用add_child()。

现在，当涉及到让卡片传送到任何地方时，这非常有效。但是，我希望它们能够顺利地从一个父节点移动到另一个父节点。实现这一目标的最佳方法是什么？或者除了使用节点之外还有更好的方法来组织我的场景吗？

我正在使用 ViewBinding，并且尝试减少创建 Fragment 的代码，该 Fragment 是一个抽象类并包含以下代码：

abstract class MyFragment<T> : Fragment() {
    
    private var binding: T? = null

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        binding = getBinding()
        return binding.root
    }
    
    abstract fun getBinding(): T
}

为了使其工作，我需要让 T 扩展一个类，并且该类需要是所有绑定类的父类。

所有生成的绑定类都有一个共同的父类？如果是这样那是什么？

我不确定使用我的方法将对象从子组件传递到其在 Blazor 中的消费父页面是否犯了错误。我有一个带有 ID、名称的 poco 类。具有从 poco 类对象列表中选择 div 的组件。用户选择一个条目，该条目应显示在父页面上。我缺乏经验，看不出我的解决方案有任何问题。1）我做对了吗？2）如果一切都好的话，OnInitializedAsync() 没有等待（父级），我应该使用 OnInitialized() 代替吗？3）Dispose的使用是否正确？4）如果我在一个应用程序中针对不同组件等使用相同的方法可能 20 次，那么这个解决方案可以吗？这个规模可以吗？谢谢，不行

父页面：

@page "/"
@inject MitarbeiterEventService MitarbeiterEventService

@implements IDisposable

<h1>ParentPage</h1>
<MitarbeiterSel></MitarbeiterSel>
<br />

@if (SelMitarbeiterFromChild != null)
{
    <p>Selected Obj. from Child: @SelMitarbeiterFromChild.Name </p>
}

@code{
    public MitarbeiterLite SelMitarbeiterFromChild;

    protected override async Task OnInitializedAsync()
    {
        MitarbeiterEventService.EventMitarbeiterChangedInComp += HandelOnMitarbeiterChangedInComp;
    }

    public async void HandelOnMitarbeiterChangedInComp(object sender, MitarbeiterLite selMitarbeiter)
    {
        SelMitarbeiterFromChild = selMitarbeiter;

        await InvokeAsync(() =>
        {
            StateHasChanged();

        });
    }

    public void Dispose()
    {
        MitarbeiterEventService.EventMitarbeiterChangedInComp -= HandelOnMitarbeiterChangedInComp;
    }
} …

我被困在子元素位置。子元素的属性有多项，父元素的属性也有多项。我发现很难找到子元素。元素操作 click() 不起作用。

网页：

<div class="locale-selector" xpath="1">
<span class="locale-selector-heading"> Your location and language</span>
<div class="locale-selector-country-wrapper" data-metrics-section="Site_lvl1_LocLangSelector">
   <a href="#" class="locale-selector-country" aria-controls="localization-container" aria-haspopup="true" aria-expanded="false">
       <div class="locale-selector-flag-heading-wrapper">
           <span class="flag-header-global flag-hong-kong"></span>
           <span class="locale-selector-country-heading">Hong Kong</span>
       </div>
       <span class="locale-selector-chevron-arrow"></span>
   </a>
</div>
</div>

span标签有多个类，div标签有多个相同的类。

如何在类上执行 click() 操作？

class="locale-selector-country-heading"

我的尝试：

cy.get('.locale-selector-country-heading').contains('Hong Kong').click()

错误：

<span class="locale-selector-country-heading">Hong Kong</span>

该元素<span.locale-selector-country-heading>不可见，因为其父元素<div.locale-selector-flag-heading-wrapper>具有 CSS 属性：visibility: hidden

我有以下(破碎)代码:

 $(".old_post").hover(function(){
    $(this > ".post_right_nav").show();

post _ right _ nav是一个div(包含其他div),它包含一些用户按下的控件.我想只在用户将鼠标悬停在帖子上时显示这些控件.如何正确选择每个帖子的子元素？

试着做一些相当简单的事情,但它正在逃避我.我有以下HTML:

<div id="four">
                <div id="thumb1" class="suiting-thumb">
                    <img src="img/gallery/suit1-thumb.jpg" alt="" title="" />
                </div>


               <div id="thumb2" class="suiting-thumb">
                    <img src="img/gallery/suit2-thumb.jpg" alt="" title="" />
                </div>


               <div id="thumb3" class="suiting-thumb">
                    <img src="img/gallery/suit3-thumb.jpg" alt="" title="" />
                </div>
</div>

我想做的只是"暗淡"父母div的孩子,除了孩子被徘徊.我用这个jQuery片段成功地做到了这一点,但淡出/进入之间有一个短暂的延迟:

$('.suiting-thumb').hover(function() {
                var thumbBtnIdPrefix = 'thumb';
                var thumbBtnNum = $(this).attr('id').substring((thumbBtnIdPrefix.length));
                $('.suiting-thumb:not(#thumb' + thumbBtnNum + ')').animate({
                    "opacity": .3
                }),200;             
            },
            function() {
                $('.suiting-thumb').animate({
                    "opacity": 1
            }),200;
        });

我觉得我需要通过用我的悬停声明选择#four来淡出父div的所有孩子,但我不太清楚如何做到这一点.任何帮助将非常感谢,谢谢!

我只是不能让这个(非常简单)的功能正常工作,parent()似乎没有找到我想要的div并淡出它:(

$('.deleteButton').click( function() {

    var img = $(this).attr('href');
    img = "../"+img;

    var answer = confirm('Are you sure you want to delete this item? (This cannot be undone!)');
    if (answer) {

        $.ajax({
            url: 'scripts/deletePhoto.php',
            data: 'img='+img,
            type: 'POST',
            mode: 'abort',
            success: function(){
                $(this).parents("div.photo").fadeOut('fast');
            }
        });
    }
return false;
});

HTML

<div class="photo">
    <img alt="" src="../static/images/photos/tmp/1.jpg">
    <div class="overlay" style="opacity: 0;">
        <p class="process success message">
            <a href="process_photo.php?img=../static/images/photos/tmp/1.jpg">Process this photo</a>
        </p>
        <p class="delete error message">
            <a href="../static/images/photos/tmp/1.jpg" class="deleteButton">Delete image</a></p>
    </div>
</div>

我试过$(this).parents(".photo").fadeOut('fast');和 …

我想点击它时提醒div的id.代码工作正常但它也警告父div的id.我怎么能避免这种情况？

这是代码:JSBin Link

<div id ="parentDiv">
  <div id ="child1"></div>
  <div id ="child2"></div>
</div>

JQuery代码:

$(document).ready(function(){
  $('div').click(function(){
   var index = $(this).attr("id");
   alert(index);
  });
});

我有这样的HTML代码

<ul>
  <li>Text</li><br>
  <li>Text</li><br>
</ul>

我想要的是,每个li元素之后的换行符都可以使用此代码完成.但问题是当我去W3C进行html5验证时,它会在此上下文中显示错误元素br不允许作为元素ul的子元素.

所以我明白br不能用作ul的子元素.我想知道有没有其他方法可以得到与上面相同的结果？如果它可以在CSS中完成,我很好.

提前致谢.