Prop being mutated and unresolved directive el

[joshharington]

I am trying to use the accordion component. It is working for the most part but throwing tons of errors.

It is saying that it is mutating a property isOpen (I don't have any props called isOpen). And: Failed to resolve directive: el

What do I do from here?

[ghost]

Having similiar issue!

When showing accordion gives error:

app.js:15573 [Vue warn]: Failed to resolve directive: el

(found in <Anonymous>)

When clicking on accordion headers gives error:

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "isOpen"

found in

---> <Panel>
       <Accordion>
         <Modal>
           <UsersEdit> at [hidden]\UsersEdit.vue
             <App> at [hidden]\App.vue
               <Root>

Here's my code, its accordion inside modal:

        <!-- User service log modal -->
        <modal :show.sync="showLogsModal" large effect="zoom">
            <div slot="modal-header" class="modal-header">
                <h4 class="modal-title">Logs</h4>
            </div>
            <div slot="modal-body" class="modal-body">
                <accordion :one-at-atime="true" type="default" class="accordion-table">
                    <panel :header="log.title" v-for="(log, key) in groupedLogs" :key="key" :is-open="key === 0">
                        <table class="table table-striped">
                            <thead>
                                <tr>
                                    <th>Time</th>
                                    <th>Event</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="l in log.logs" :key="l.id">
                                    <td>{{ l.time }}</td>
                                    <td>{{ l.event }}</td>
                                </tr>
                            </tbody>
                        </table>
                    </panel>
                </accordion>
            </div>
            <div slot="modal-footer" class="modal-footer">
                <button type="button" class="btn btn-default" @click="toggleLogsModal">Close</button>
            </div>
        </modal>

[abishekrsrikaanth]

@yuche any resolution to this. Have the same issue