java - 确保 Vaadin 在单击添加的组件(例如 TabSheet 或 Tree ...)时加载最新数据

Question

当我向 Vaadin 的组件添加组件(例如 TabSheet 或 Tree)时，添加的组件会被缓存。当用户单击选项卡(或树节点)时，如果它包含数据库数据，则显示陈旧数据，不反射(reflect)最新的数据库状态。

请问有没有办法保证加载最新的数据？

我通过定义自定义界面来解决问题:

public interface Reloadable {
  void reload();
}

并且每个组件都实现了这个Reloadable接口(interface)，如:

@SpringComponent
public class TeachersView extends VerticalLayout implements Reloadable, Serializable {

  @Inject
  private TeacherDao teacherDao;
  private final static int PAGESIZE = 10;

  private MTable<Teacher> mTable = new MTable<>(Teacher.class);

  @PostConstruct
  public void init() {
    // mTable settings skip here
    reload();
    addComponent(mTable);
  }

  @Override
  public void reload() {
    mTable.setBeans(new SortableLazyList<>(
      sortablePagingProvider ,
      () -> (int) teacherDao.count() ,
      PAGESIZE
    ));
  }

  private SortableLazyList.SortablePagingProvider<Teacher> sortablePagingProvider =
    (firstRow, asc, sortProperty) -> {  
      return teacherDao.findAll(
        new PageRequest(
          firstRow / PAGESIZE, PAGESIZE,
          asc ? Sort.Direction.ASC : Sort.Direction.DESC,
          sortProperty == null ? "id" : sortProperty
        )
      ).getContent();
    };
}

这个 View 被注入(inject)到 UI 类中:

@SpringUI(path = "/ui")
@Theme("valo")
public class VaadinUI extends UI {
  @Inject
  private TeacherDao teacherDao;

  @Inject
  private TeachersView teachersView;

  @Override
  protected void init(VaadinRequest vaadinRequest) {
    Panel panel = new Panel("Admin Panel");

    HorizontalSplitPanel splitPanel = new HorizontalSplitPanel();
    splitPanel.setSplitPosition(15, Unit.PERCENTAGE);
    panel.setContent(splitPanel);

    Tree tree = new Tree("Menu");
    splitPanel.setFirstComponent(tree);

    Label home = new Label("Home");

    Map<String, Component> map = new HashMap<>();
    map.put("Teachers", teachersView);
    map.put("Home", home);

    map.forEach((k, v) -> tree.addItem(k));

    tree.addItemClickListener(event -> {

      Component view = map.get(event.getItemId());
      if (view instanceof Reloadable) {
        ((Reloadable) view).reload();
      }
      splitPanel.setSecondComponent(view);
    });

    splitPanel.setSecondComponent(home);
    setContent(panel);
  } // init()
}

注意 tree.addItemClickListener ，我必须检查每个组件是否实现 Reloadable ，如果 true ，则调用它。

它有效。但我不知道这是否是实现这一目标的标准方式？我认为这应该是一个常见的场景，应该有一些类似内置接口(interface)的东西供组件来实现，比如 onRender 之类的(但我找不到)。我错过了什么吗？

谢谢。

Answer 1

首先，我将在 Spring & Vaadin 上推荐本教程。您可能已经看过，但我将在几个地方引用它，我认为这是 Vaadin 和 Spring 集成的一个很好的起点。

其次，出于好奇，为什么要使用树来构建菜单？

在提供的示例中，您似乎正在对某些 View 功能之间的导航进行建模，这已经是 available in Vaadin ，并且由于您正在使用 Spring ，瓦丁 spring & spring-boot扩展使之变得非常容易define and navigate between your views 。然后，您可以在每个 View 自己的 enter() 方法中为每个 View 定义一些特定行为。我用过Vaadin dashboard demo作为以下更改的灵感:

@SpringView(name = TeachersView.NAME)
public class TeachersView extends VerticalLayout implements View {
    public static final String NAME = "Teachers";

    private Label title = new Label("Teachers view");

    @PostConstruct
    void init() {
        addComponent(title);
    }

    @Override
    public void enter(ViewChangeListener.ViewChangeEvent event) {
        // recreate or reload stuff here
        title.setValue("Teachers view reloaded @ " + new Date());
    }
}

@SpringView(name = HomeView.NAME)
public class HomeView extends VerticalLayout implements View {
    public static final String NAME = "";

    @PostConstruct
    void init() {
        addComponent(new Label("Home"));
    }

    @Override
    public void enter(ViewChangeListener.ViewChangeEvent event) {
        // meh, nothing special to do here
    }
}

public class SpringVaadinUI extends UI {

    @Autowired
    private SpringViewProvider viewProvider;

    @Override
    protected void init(VaadinRequest vaadinRequest) {
        addStyleName(ValoTheme.UI_WITH_MENU);
        Panel panel = new Panel("Admin Panel");

        HorizontalSplitPanel splitPanel = new HorizontalSplitPanel();
        splitPanel.setSplitPosition(15, Unit.PERCENTAGE);
        panel.setContent(splitPanel);

        VerticalLayout navigationBar = new VerticalLayout();
        navigationBar.setPrimaryStyleName(ValoTheme.MENU_ROOT);
        navigationBar.addComponent(createNavigationButton("Home", FontAwesome.HOME, HomeView.NAME));
        navigationBar.addComponent(createNavigationButton("Teachers", FontAwesome.GROUP, TeachersView.NAME));
        splitPanel.setFirstComponent(navigationBar);

        CssLayout navigationDisplay = new CssLayout();
        splitPanel.setSecondComponent(navigationDisplay);

        Navigator navigator = new Navigator(this, navigationDisplay);
        navigator.addProvider(viewProvider);

        setContent(panel);
    }

    private Button createNavigationButton(String caption, FontAwesome icon, final String viewName) {
        Button button = new Button(caption, icon);
        button.setPrimaryStyleName(ValoTheme.MENU_ITEM);
        button.addStyleName(ValoTheme.BUTTON_SMALL);
        button.addStyleName(ValoTheme.BUTTON_BORDERLESS);
        button.addClickListener(event -> getUI().getNavigator().navigateTo(viewName));
        return button;
    }
}

结果类似于:

如果由于某种原因您不能或不想使用导航器，那么您的解决方案看起来不错。尽管如此，无论您选择使用哪种解决方案，您都应该知道 by default Spring 创造singletons 。除了 UI 等少数组件外，您可能应该将组件更改为 prototypes所以你每次都会得到一个新的实例。否则，您的所有用户在访问应用程序时都会获得相同的实例，我认为您不希望发生这种情况。