mdbootstrap / mdbsvelte

Svelte Bootstrap with Material Design
https://saurav.tech/mdbsvelte/
MIT License
69 stars 7 forks source link

Modal outros error #5

Closed nbrajnov closed 4 years ago

nbrajnov commented 4 years ago

While trying to close modal:

index.mjs:754 Uncaught (in promise) TypeError: Cannot read property 'c' of undefined
    at transition_out (index.mjs:754)
    at Object.outro [as o] (design.svelte:46)
    at ft (mdbsvelte.es.js:759)
    at Object.o (mdbsvelte.es.js:611)
    at ft (mdbsvelte.es.js:759)
    at Object.p (mdbsvelte.es.js:611)
    at ot (mdbsvelte.es.js:707)
    at st (mdbsvelte.es.js:676)

Can you help?

SauravKanchan commented 4 years ago

Can you tell me how did you install mdbsvelte and how are you importing MDBModal? and if possible can you share your code

nbrajnov commented 4 years ago

npm i mdbsvelte package.json

"mdbsvelte": "^1.0.3",
"svelte": "^3.23.0",

modal.svelte

<svelte:head>
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
  <!-- Google Fonts -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap">
  <!-- Bootstrap core CSS -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet">
  <!-- Material Design Bootstrap -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.16.0/css/mdb.min.css" rel="stylesheet">
</svelte:head>

<script>

  import {MDBContainer, MDBBtn, MDBModal, MDBModalBody, MDBModalHeader, MDBModalFooter} from "mdbsvelte";

  let isOpen = false;

  function toggle() {
    isOpen = !isOpen
  }

</script>
<MDBContainer>
  <MDBBtn on:click={toggle}>Modal</MDBBtn>
  <MDBModal isOpen={isOpen} toggle={toggle}>
    <MDBModalHeader toggle={toggle}>MDBModal title</MDBModalHeader>
    <MDBModalBody>
      (...)
    </MDBModalBody>
    <MDBModalFooter>
      <MDBBtn color="secondary" on:click={toggle}>Close</MDBBtn>
      <MDBBtn color="primary">Save changes</MDBBtn>
    </MDBModalFooter>
  </MDBModal>
</MDBContainer>
SauravKanchan commented 4 years ago

try importing import {...} from "mdbsvelte/src/index.js";