CODEWITHSUNDEEP
csssass
Jason Denayer
Jason Denayer

Reputation: 13

SASS - Accessing Multidimensional Array's Value

I'm new at SASS. I created a multidimensional array, like this:

$content: (
    width: 100%,
    content-header: (
        width: 320px
    ),
    content-main: (
        width: 100%
    ),
    content-footer: (
        width: 320px
    )
);

How can i access directly nested array value?

I want to access $content-main[width]. How can i access?

Upvotes: 1

Views: 2484

Answers (2)

Roman B.
Roman B.

Reputation: 1

https://sass-lang.su/documentation/modules/map

map.get($content, "content-main", "width");

Upvotes: 0

nanobar
nanobar

Reputation: 66475

You're making this considerably harder than it needs to be. Arrays are useful if you need to loop over variables, you would need to make your own sass function for this which uses map-get. I strongly recommend just using namespaced variables which are simpler and more portable e.g. $content-width $content-main-width.

If you really want to do it see https://css-tricks.com/snippets/sass/deep-getset-maps/

/// Map deep get
/// @author Hugo Giraudel
/// @access public
/// @param {Map} $map - Map
/// @param {Arglist} $keys - Key chain
/// @return {*} - Desired value
@function map-deep-get($map, $keys...) {
    @each $key in $keys {
        $map: map-get($map, $key);
    }
    @return $map;
}

map-deep-get($content, "content-header", "width");

Upvotes: 1

Related Questions