0

反応コンポーネントが使用している角度コントローラーにデータを保存しています。問題は、データを変更すると、ルートコンポーネントである反応コンポーネントが再レンダリングされないことです。 componentWillReceiveProps を使用しようとしていますが、このコンポーネントwatch-depth = "reference/value" を試しましたが<react-component>、それでも役に立ちませんでした。コンポーネントを強制的に再レン​​ダリングする方法を教えてもらえますか?

コントローラ:

    app.controller('MainCtrl', function ($scope) {
        $scope.myComponent = {};
        console.log($scope.myComponent);
        console.log(document.body.children[0].children[0]);
        $scope.resultProps = {
            item:[]
        }
        $scope.firstArrayProps =  {
            item:[],
            result:$scope.resultProps
        }
        $scope.secondArrayProps =  {
            item:[],
            result:$scope.resultProps
        }

        $(document.body.children[0].children[0]).keydown(function(e) {
            console.log('voala');
            var key = e.which || e.keyCode;
            if(key == 46) {
                console.log('voala');
                setTimeout(function () {
                    $scope.firstArrayProps.item.length = 0; //HERE IM CHANGING DATA
                }, 1000);
            }
        });
...

反応コンポーネント:

var DiaryTable = React.createClass({displayName: "DiaryTable",
    getInitialState: function() {
        return {
            items : this.props.item,
            globalChecked:false
        };
    },
....

html:

<body  ng-app="app" ng-controller="MainCtrl as mainCtrl">

<div class="tableWrapper">
    <react-component name="DiaryTable" props="firstArrayProps"  watch-depth="value"/>
</div>

<button class="myMergeButton" id="mergeButton" ng-click="runMerge()">Merge diaries</button>

<div class="tableWrapper">
    <react-component name="DiaryTable" props="secondArrayProps" watch-depth="value"/>
</div>
...
4

1 に答える 1