TypeError: Cannot create property 'default' on boolean 'true'

[bskscmn]

Hi, I am getting this error. Am I doing something wrong? Thanks.

[Vue warn]: Error in render: "TypeError: Cannot create property 'default' on boolean 'true'"

found in

---> <Pagination>
       <User> at resources/js/components/User.vue
         <Root>

TypeError: Cannot create property 'default' on boolean 'true'
    at Proxy.resolveScopedSlots (app.js:69748)
    at Proxy.render (app.js:18948)
    at VueComponent.Vue._render (app.js:70386)
    at VueComponent.updateComponent (app.js:70886)
    at Watcher.get (app.js:71284)
    at Watcher.run (app.js:71359)
    at flushSchedulerQueue (app.js:71117)
    at Array.<anonymous> (app.js:68845)
    at flushCallbacks (app.js:68771)

Screen Shots:

[gilbitron]

Would it be possible to share your Vue component code?

[bskscmn]

<tr v-for="user in users.data" :key="user.id">
            <td>{{ user.name  }}</td>
            <td>{{ user.username }}</td>
             <td><span v-for="role in user.roles">|{{ role.name }}|</span></td>
 </tr>
  ....                    
<pagination :data="users" @pagination-change-page="getResults"></pagination>

data() {
          return {
            editMode: false,
            users : {},
          }
        },
        methods: {
          getResults(page = 1) {
            axios.get('api/user?page=' + page)
            .then(response => {
              this.users = response.data;
            });
          },
          loadUsers(){
              axios.get('api/user').then(({ data }) => (this.users = data));
          },
....

From Controller: return User::latest()->with('roles')->paginate(2);

[alirezaashrafi]

Did you solved the problem? Because I have a similar problem @bskscmn

[bskscmn]

Unfortunately not. @alirezaashrafi

[alirezaashrafi]

😔😞

[lavender16]

check your vue version I have the same problem, used laravel-vue-pagination@2.2.0 and then resolved.

[panstromek]

This seems like a bug with hot reloding components with new slot syntax. I have similar issue, but I don't use this package.

[emmatinolexis]

I am facing similar issue.. has it been solved?

[ghost]

Having the similar issue, odd thing is that exactly the same GIT repository works on my vagrant machine locally, but does not work on the acceptance environment with this exact exception.

Reverting to 2.2.0 as stated by @lavender16 works and fixes the issue.

[tclairet]

Got the same issue and found that using yarn make it works.

[Phancie]

npm install laravel-vue-pagination@2.1.0 --save

This version would solve the issue

[henriquek3]

I have a similar problem when I get paging data through Vuex @ store; I'm starting with Vue but I think this problem can be solved using a Mutation, now I don't know how to implement this.

I came to this conclusion by populating the table through a computed variable, that in some moments I have the return of the axes and in another moment I have an Observer as a return, I think that when I have the Observer as a return to the variable it has not yet been computed

[OfficialRohitSharma442]

i am having this issue in react js

× TypeError: Cannot create property 'datasets' on boolean 'true'

// Do NOT use mergeConfig for the data object because this method merges arrays 9251 | // and so would change references to labels and datasets, preventing data updates. 9252 | var data = config.data = config.data || {};

9253 | data.datasets = data.datasets || []; | ^ 9254 | data.labels = data.labels || []; 9255 | 9256 | config.options = mergeConfig(

[Penchala30]

× TypeError: Cannot create property 'datasets' on boolean 'true' initConfig D:/Covid Tracker Clone/covidclone/node_modules/chart.js/dist/Chart.js:9253 9250 | // Do NOT use mergeConfig for the data object because this method merges arrays 9251 | // and so would change references to labels and datasets, preventing data updates. 9252 | var data = config.data = config.data || {};

9253 | data.datasets = data.datasets || []; | ^ 9254 | data.labels = data.labels || []; 9255 | 9256 | config.options = mergeConfig( View compiled Chart.construct D:/Covid Tracker Clone/covidclone/node_modules/chart.js/dist/Chart.js:9322 9319 | construct: function(item, config) { 9320 | var me = this; 9321 | 9322 | config = initConfig(config); | ^ 9323 | 9324 | var context = platform.acquireContext(item, config); 9325 | var canvas = context && context.canvas; View compiled new Chart D:/Covid Tracker Clone/covidclone/node_modules/chart.js/dist/Chart.js:9311 9308 | } 9309 | 9310 | var Chart = function(item, config) { 9311 | this.construct(item, config); 9312 | return this; 9313 | }; 9314 | View compiled ChartComponent.renderChart D:/Covid Tracker Clone/covidclone/node_modules/react-chartjs-2/es/index.js:290 287 | options.legend = legend; 288 | } 289 | 290 | this.chartInstance = new _chart["default"](node, { | ^ 291 | type: type, 292 | data: data, 293 | options: options, View compiled ChartComponent.componentDidMount D:/Covid Tracker Clone/covidclone/node_modules/react-chartjs-2/es/index.js:98 95 | _createClass(ChartComponent, [{ 96 | key: "componentDidMount", 97 | value: function componentDidMount() { 98 | this.renderChart(); | ^ 99 | } 100 | }, { 101 | key: "componentDidUpdate", View compiled commitLifeCycles D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:20663 20660 | } 20661 | 20662 | { 20663 | instance.componentDidMount(); | ^ 20664 | } 20665 | } else { 20666 | var prevProps = finishedWork.elementType === finishedWork.type ? current.memoizedProps : resolveDefaultProps(finishedWork.type, current.memoizedProps); View compiled commitLayoutEffects D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:23426 23423 | 23424 | if (flags & (Update | Callback)) { 23425 | var current = nextEffect.alternate; 23426 | commitLifeCycles(root, current, nextEffect); | ^ 23427 | } 23428 | 23429 | { View compiled HTMLUnknownElement.callCallback D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:3945 3942 | function callCallback() { 3943 | didCall = true; 3944 | restoreAfterDispatch(); 3945 | func.apply(context, funcArgs); | ^ 3946 | didError = false; 3947 | } // Create a global error event handler. We use this to capture the value 3948 | // that was thrown. It's possible that this error handler will fire more View compiled invokeGuardedCallbackDev D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:3994 3991 | // errors, it will trigger our global error handler. 3992 | 3993 | evt.initEvent(evtType, false, false); 3994 | fakeNode.dispatchEvent(evt); | ^ 3995 | 3996 | if (windowEventDescriptor) { 3997 | Object.defineProperty(window, 'event', windowEventDescriptor); View compiled invokeGuardedCallback D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:4056 4053 | function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) { 4054 | hasError = false; 4055 | caughtError = null; 4056 | invokeGuardedCallbackImpl$1.apply(reporter, arguments); 4057 | } 4058 | /* 4059 | Same as invokeGuardedCallback, but instead of returning an error, it stores View compiled commitRootImpl D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:23151 23148 | 23149 | do { 23150 | { 23151 | invokeGuardedCallback(null, commitLayoutEffects, null, root, lanes); | ^ 23152 | 23153 | if (hasCaughtError()) { 23154 | if (!(nextEffect !== null)) { View compiled unstable_runWithPriority D:/Covid Tracker Clone/covidclone/node_modules/scheduler/cjs/scheduler.development.js:646 643 | currentPriorityLevel = priorityLevel; 644 | 645 | try { 646 | return eventHandler(); | ^ 647 | } finally { 648 | currentPriorityLevel = previousPriorityLevel; 649 | } View compiled runWithPriority$1 D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:11276 11273 | 11274 | function runWithPriority$1(reactPriorityLevel, fn) { 11275 | var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel); 11276 | return Scheduler_runWithPriority(priorityLevel, fn); 11277 | } 11278 | function scheduleCallback(reactPriorityLevel, callback, options) { 11279 | var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel); View compiled commitRoot D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:22990 22987 | 22988 | function commitRoot(root) { 22989 | var renderPriorityLevel = getCurrentPriorityLevel(); 22990 | runWithPriority$1(ImmediatePriority$1, commitRootImpl.bind(null, root, renderPriorityLevel)); 22991 | return null; 22992 | } 22993 | View compiled performSyncWorkOnRoot D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:22329 22326 | var finishedWork = root.current.alternate; 22327 | root.finishedWork = finishedWork; 22328 | root.finishedLanes = lanes; 22329 | commitRoot(root); // Before exiting, make sure there's a callback scheduled for the next | ^ 22330 | // pending level. 22331 | 22332 | ensureRootIsScheduled(root, now()); View compiled scheduleUpdateOnFiber D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:21881 21878 | // root inside of batchedUpdates should be synchronous, but layout updates 21879 | // should be deferred until the end of the batch. 21880 | 21881 | performSyncWorkOnRoot(root); | ^ 21882 | } else { 21883 | ensureRootIsScheduled(root, eventTime); 21884 | schedulePendingInteractions(root, lane); View compiled updateContainer D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:25482 25479 | } 25480 | 25481 | enqueueUpdate(current$1, update); 25482 | scheduleUpdateOnFiber(current$1, lane, eventTime); 25483 | return lane; 25484 | } 25485 | function getPublicRootInstance(container) { View compiled (anonymous function) D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:26021 26018 | 26019 | 26020 | unbatchedUpdates(function () { 26021 | updateContainer(children, fiberRoot, parentComponent, callback); | ^ 26022 | }); 26023 | } else { 26024 | fiberRoot = root._internalRoot; View compiled unbatchedUpdates D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:22431 22428 | executionContext |= LegacyUnbatchedContext; 22429 | 22430 | try { 22431 | return fn(a); | ^ 22432 | } finally { 22433 | executionContext = prevExecutionContext; 22434 | View compiled legacyRenderSubtreeIntoContainer D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:26020 26017 | } // Initial mount should not be batched. 26018 | 26019 | 26020 | unbatchedUpdates(function () { | ^ 26021 | updateContainer(children, fiberRoot, parentComponent, callback); 26022 | }); 26023 | } else { View compiled render D:/Covid Tracker Clone/covidclone/node_modules/react-dom/cjs/react-dom.development.js:26103 26100 | } 26101 | } 26102 | 26103 | return legacyRenderSubtreeIntoContainer(null, element, container, false, callback); 26104 | } 26105 | function unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) { 26106 | if (!isValidContainer(containerNode)) { View compiled Module. D:/Covid Tracker Clone/covidclone/src/index.js:7 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | ReactDOM.render( 8 | 9 | 10 | </React.StrictMode>, View compiled Module../src/index.js http://localhost:3000/static/js/main.chunk.js:1328:30 webpack_require D:/Covid Tracker Clone/covidclone/webpack/bootstrap:856 853 | 854 | webpack_require.$Refresh$.init(); 855 | try { 856 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId)); | ^ 857 | } finally { 858 | webpack_require.$Refresh$.cleanup(moduleId); 859 | } View compiled fn D:/Covid Tracker Clone/covidclone/webpack/bootstrap:150 147 | ); 148 | hotCurrentParents = []; 149 | } 150 | return webpack_require(request); | ^ 151 | }; 152 | var ObjectFactory = function ObjectFactory(name) { 153 | return { View compiled 1 http://localhost:3000/static/js/main.chunk.js:1553:18 webpack_require D:/Covid Tracker Clone/covidclone/webpack/bootstrap:856 853 | 854 | webpack_require.$Refresh$.init(); 855 | try { 856 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId)); | ^ 857 | } finally { 858 | webpack_require.$Refresh$.cleanup(moduleId); 859 | } View compiled checkDeferredModules D:/Covid Tracker Clone/covidclone/webpack/bootstrap:45 42 | } 43 | if(fulfilled) { 44 | deferredModules.splice(i--, 1); 45 | result = webpack_require(__webpack_require__.s = deferredModule[0]); | ^ 46 | } 47 | } 48 | View compiled Array.webpackJsonpCallback [as push] D:/Covid Tracker Clone/covidclone/webpack/bootstrap:32 29 | deferredModules.push.apply(deferredModules, executeModules || []); 30 | 31 | // run deferred modules when all chunks ready 32 | return checkDeferredModules(); | ^ 33 | }; 34 | function checkDeferredModules() { 35 | var result; View compiled (anonymous function) http://localhost:3000/static/js/main.chunk.js:1:73 This screen is visible only in development. It will not appear if the app crashes in production. Open your browser’s developer console to further inspect this error. Click the 'X' or hit ESC to dismiss this message.

I am getting this error can please anyone resolve these

[Sumit-malviya-au8]

I also faced the same error. I solved it by removing the particular component where i was not passing the props.

[Dfelix02]

I imported this: import { Line } from "react-chartjs-2"; I was calling the Line component with nothing on my data <Line data options /> "hence, passing data={true}" data needs to have something. https://www.chartjs.org/docs/latest/charts/line.html <<---- here is the official documentation seems like it has something to do with the x and y axis data: [{ x: 10, y: 20 }, { x: 15, y: 10 }] sorry I don't really know how to do this, explain stuff I mean. hope it helps...

[github-actions[bot]]

This issue is stale because it has been open for 90 days with no activity.

[github-actions[bot]]

This issue was closed because it has been inactive for 30 days since being marked as stale.