famo.us:在famo.us中“部署”函数的含义是什么？

Question

我看过一些例子，人们在famo.us中对famo.us类进行了子类化，并重写了deploy函数。这是famo.us在renderables上需要的一个特殊功能吗？我有一个正在构建的“控件”，当它变得可见时，它有一些我想要显示的动画，但我不希望它们在实例化对象时启动，我希望它们在稍后显示给用户时显示出来。这就是deploy函数的作用吗？

Answer 1

公开:我可能是其中许多例子的作者，您已经看到了覆盖部署。

当我使用Famo.us并需要将自己的属性添加到原生DOM元素时，我使用了Surface中的deploy函数。Deploy接受它从管理DOM资源的ElementAllocator接收的目标元素。这是Surface更改原始DOM元素的任何属性以适应为Surface提供的选项的机会。

要回答您的问题，只有当您需要在屏幕上显示原始DOM元素之前访问原始DOM元素时，才需要重写deploy函数。但是，您只需要设置元素的不透明度，并且可以在“部署”事件上使用曲面进行设置。

下面是使用事件的示例。

var Engine          = require('famous/core/Engine');
var Surface         = require('famous/core/Surface');
var StateModifier   = require('famous/modifiers/StateModifier');

var context = Engine.createContext();

var surface = new Surface({
    size:[200,200],
    content:"Hello!",
    properties: {
        backgroundColor:'green',
        color:'white',
        textAlign:'center',
        lineHeight:'200px'
    }
})

surface.on('deploy',function(){
    console.log("Deployed!");
    surface.state.setOpacity(1);
})

surface.state = new StateModifier({ origin:[0.5,0.5]});

surface.state.setOpacity(0);

context.add(surface.state).add(surface);

在使用deploy事件时，您还可以看到一些非常有趣的东西。如果您通过web控制台或grunt重新加载代码，并且Famo.us应用程序不是当前可见的选项卡，则不会调用deploy函数。这是requestAnimationFrame的一个函数，它允许它不花费周期更新不可见的屏幕。当您最终打开选项卡时，您可以看到“部署！”登录到控制台。

希望这能有所帮助！

Answer 2

我不确定是否要重写deploy方法，但我认为您要寻找的是'deploy‘事件。

当将表面添加到活动区域时，确实会触发“deploy”事件。因此，对于您想要在面位于dom树中之后运行的代码：

var surface = new Surface({content: 'foo'})
surface.on('deploy', function() {
   // your code that requires surface to be in the dom
});

我不是famo.us开发人员，所以这不是一个“官方”答案，但我在源代码中看到了这一点，并且已经开始使用它了。

来源：https://github.com/Famous/core/blob/35461b36c8d09d39e96c3d61ebd7908946d3f668/Surface.js#L451