zoukankan      html  css  js  c++  java
  • knockoutjs关于ko.bindingHandlers的updata订阅

    ko.bindingHandlers是先执行init进行初始化数据的绑定(如果需要执行updata进行数据更新可以不用初始化);

    1 init: function(element, valueAccessor) {
    2                     //初始化数据--然后执行updata进行需要更新数据的绑定,添加订阅
    3                     //如果在updata进行了数据的执行,init可以添加初始化事件
    4                     var value = valueAccessor(); // Get the current value of the current property we're bound to
    5                     $(element).text(value); // jQuery will hide/show the element depending on whether "value" or true or false
    6                 },
    ko.bindinHandlers.init

    在updata里面,才是订阅产生的时候,而不是在init的时候,数据就绑定了订阅;

    1 update: function(element, valueAccessor, allBindings) {
    2                     var value = ko.unwrap(valueAccessor()); //执行更新数据绑定,必须要执行一次否则无法确定添加订阅
    3                     //var value = valueAccessor()(); // Get the current value of the current property we're bound to
    4                     $(element).text(value);
    5                 }
    ko.dindingHandlers.updata

    完整代码如下:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script type="text/javascript" src="js/jquery-2.1.0.js"></script>
            <script type="text/javascript" src="js/knockout-3.4.0.debug.js"></script>
            <script type="text/javascript">
                ko.bindingHandlers.slideVisible = {
                    init: function(element, valueAccessor) {
                        //初始化数据--然后执行updata进行需要更新数据的绑定,添加订阅
                        //如果在updata进行了数据的执行,init可以添加初始化事件
                        var value = valueAccessor(); // Get the current value of the current property we're bound to
                        $(element).text(value); // jQuery will hide/show the element depending on whether "value" or true or false
                    },
                    update: function(element, valueAccessor, allBindings) {
                        var value = ko.unwrap(valueAccessor()); //执行更新数据绑定,必须要执行一次否则无法确定添加订阅
                        //var value = valueAccessor()(); // Get the current value of the current property we're bound to
                        $(element).text(value);
                    }
                };
                var model = {
                    te: ko.observable("ttttttttt"),
                    aaa: function() {
                        this.te("aaaaaaaaaaaaaaaaaaaa");
                    }
                }
                window.onload = function() {
                    ko.applyBindings(model, document.body)
                }
            </script>
        </head>
    
        <body>
            <div data-bind="slideVisible:te"></div>
            <input type="button" value="aaaaaaaaa" data-bind="click:aaa" />
        </body>
    </html>
    ko.bindingHandlers.model

    注:小七目前还是小白,写的博客为笔记类型的博客,是在项目中遇到的问题,仅用于学习。

      涉及到原理部分还未做总结。

      如果内容有不对、不全面或者其他的问题,欢迎大家纠正。

    内容为小七在工作中遇到或在其他地方看到所做的总结,方便以后查看,仅供学习使用; 转载请注明出处;
  • 相关阅读:
    6_10 下落的树叶(UVa699)<二叉树的DFS>
    6_9 天平(UVa839)<二叉树的DFS>
    6_8 树(UVa548)<从中序和后序恢复二叉树>
    6_7 树的层次遍历(UVa122)<二叉树的动态创建与BFS>
    6_6 小球下落(UVa679)<完全二叉树编号>
    6_4 破损的键盘(UVa11988)<链表>
    6_3 矩阵链乘(UVa424)<用栈实现简单的表达式解析>
    6_2 铁轨(UVa514)<栈>
    第五周课程总结&试验报告(三)
    第四周课程总结和实验报告
  • 原文地址:https://www.cnblogs.com/xiaoxiaoqiye/p/5908198.html
Copyright © 2011-2022 走看看