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